@charset "UTF-8";
/*
 * Altnoy - One Click Accessibility (Pojo) repair sheet
 * =====================================================================
 * Fixes the font-resize steps (120-200) and the three contrast modes on
 * a pixel-based, bilingual (he_IL / en_US), Elementor + Twenty Twenty-One
 * site.
 *
 * RULE A - with no accessibility option selected, and after Reset, this
 *   file changes nothing: every selector is gated behind a
 *   `body[class*="pojo-a11y-..."]` attribute selector.
 * RULE B - #pojo-a11y-toolbar (Pojo) and .a11y-toolbar (wp-accessibility)
 *   are siblings of the content roots, and every generic rule here is
 *   scoped to a content root, so neither toolbar is ever touched.
 *
 * CASCADE LAYERS
 *   For `!important` declarations the cascade reverses layer order:
 *   an earlier layer beats a later one, and un-layered `!important`
 *   (the plugin, the theme, the site's Additional CSS) is the weakest of
 *   all. That is what lets a rule here out-rank the plugin's contrast
 *   block, whose selectors score (1,1,1) / (1,2,1) thanks to
 *   `:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link)`.
 *   Section 6 carries those same two `:not()`s, so the contrast repairs
 *   also win on plain specificity and survive a minifier that drops the
 *   layer wrapper. Verified both ways.
 *
 *   a11y-strong - declarations the site itself marked `!important`
 *                 (they beat Elementor's per-widget typography, exactly
 *                 as they do today) plus the contrast repairs.
 *   a11y-el     - Elementor per-widget typography, extracted from the 23
 *                 post-*.css files.
 *   a11y-base   - the scale curves, the anti-compounding fix, the form
 *                 rules and the theme's normal-weight type scale.
 *
 * MAINTENANCE
 *   Sections 5 and 5b are generated from the site's own CSS. Re-generate
 *   them after changing commonstyle.css / responsive.css or after editing
 *   typography on an Elementor page. New project imagery needs nothing:
 *   the templates emit `--a11y-bg` next to every inline background-image,
 *   so Section 6b picks it up on its own. Bump the version in the
 *   wp_enqueue_style() call in functions.php and purge the LiteSpeed cache
 *   on every deploy.
 */

@layer a11y-strong, a11y-el, a11y-base;

@layer a11y-base {

/* ==========================================================================
   SECTION 1 — scale curves
   The plugin emits nine steps (120…200). Percentages compound through
   nested elements, so we ignore its values entirely and drive everything
   from three multipliers:
     --a11y-scale       body copy, nav, small headings
     --a11y-scale-lg    display text (>= 40px) — damped so the desktop
                        layout survives; this text is already large.
     --a11y-scale-form  form controls, buttons, messages and the cookie
                        banner — they start smallest and need the biggest
                        first jump to be perceptible.
   ========================================================================== */
/* The defaults are gated, not put on :root. An un-gated :root block adds
   three inherited custom properties to every element's computed style even
   with nothing selected — measured, that was the ONLY difference between
   "sheet loaded" and "sheet absent" on a clean page. Gating makes that diff
   literally empty (RULE A), and keeping a default of 1 means an
   unrecognised step class degrades to "no change" instead of to an invalid
   font-size. */
body[class*="pojo-a11y-"]{--a11y-scale:1;--a11y-scale-lg:1;--a11y-scale-form:1;}

body.pojo-a11y-resize-font-120{--a11y-scale:1.08;--a11y-scale-lg:1.05;--a11y-scale-form:1.20;}
body.pojo-a11y-resize-font-130{--a11y-scale:1.15;--a11y-scale-lg:1.09;--a11y-scale-form:1.30;}
body.pojo-a11y-resize-font-140{--a11y-scale:1.22;--a11y-scale-lg:1.13;--a11y-scale-form:1.40;}
body.pojo-a11y-resize-font-150{--a11y-scale:1.28;--a11y-scale-lg:1.17;--a11y-scale-form:1.48;}
body.pojo-a11y-resize-font-160{--a11y-scale:1.35;--a11y-scale-lg:1.21;--a11y-scale-form:1.55;}
body.pojo-a11y-resize-font-170{--a11y-scale:1.42;--a11y-scale-lg:1.25;--a11y-scale-form:1.62;}
body.pojo-a11y-resize-font-180{--a11y-scale:1.48;--a11y-scale-lg:1.29;--a11y-scale-form:1.68;}
body.pojo-a11y-resize-font-190{--a11y-scale:1.54;--a11y-scale-lg:1.32;--a11y-scale-form:1.72;}
body.pojo-a11y-resize-font-200{--a11y-scale:1.60;--a11y-scale-lg:1.35;--a11y-scale-form:1.75;}

/* ==========================================================================
   SECTION 2 — base pin on every content root
   `body` is deliberately left alone: the plugin sets body to NN% of the
   10px <html> size (13px at step 130, 20px at 200) and the two toolbars
   sit outside the content roots, so leaving body as-is keeps them behaving
   exactly as they do today (RULE B).
   The theme's own base is `body, p, li { font-size:19px; line-height:27px }`
   with 25px/34px from 1920px up — mirrored here 1:1.
   ========================================================================== */
body[class*="pojo-a11y-resize-font-"] :is(.site,.site-content,.widget-area,.sticky-social-menu,footer,.comments-area,.post-navigation,.elementor,.cky-consent-container,.cky-modal,.cky-preference-center){
  font-size:calc(19px * var(--a11y-scale))!important;
  line-height:calc(27px * var(--a11y-scale))!important;
}
@media (min-width:1920px){
  body[class*="pojo-a11y-resize-font-"] :is(.site,.site-content,.widget-area,.sticky-social-menu,footer,.comments-area,.post-navigation,.elementor,.cky-consent-container,.cky-modal,.cky-preference-center){
    font-size:calc(25px * var(--a11y-scale))!important;
    line-height:calc(34px * var(--a11y-scale))!important;
  }
}

/* ==========================================================================
   SECTION 3 — stop the compounding
   The plugin puts `font-size:NN%` on p, li, label, legend, code, pre, dd,
   dt, span and blockquote. CF7 nests span > span > span, so the consent
   label measured 12px -> 1280px at step 200 and the text input 19px ->
   160px. Flattening those elements to `inherit` removes both the runaway
   and the plugin's own scaling; their designed sizes come back, multiplied
   exactly once, in Sections 4 and 5.
   Specificity is deliberately low — (0,1,1) — so every later rule in this
   layer wins on specificity, while the layer itself wins over the plugin.
   `input/select/textarea` are excluded here and handled in Section 4.
   `small/sub/sup` are excluded on purpose: they are relative units already
   and scale correctly once their parent does.
   ========================================================================== */
/* `p` and `li` are NOT flattened to `inherit`: the theme gives them an
   explicit size of their own (`body, p, li { font-size:19px }`, 25px from
   1920px up), and `inherit` would hand them whatever the nearest sized
   ancestor happens to be. Twenty Twenty-One sizes `.primary-navigation` at
   `--primary-nav--font-size` = 12.5px, so every menu `li` DROPPED from 19px
   to 12.5px the moment a step was selected — text getting smaller as the
   visitor asks for bigger. They are restated here at the theme's own value
   and at the theme's own (lowest) specificity, so every more specific rule
   in Section 5 still wins exactly as it does today. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,.sticky-social-menu,footer,.comments-area,.post-navigation,.elementor,.cky-consent-container,.cky-modal,.cky-preference-center) :where(p,li){
  font-size:calc(19px * var(--a11y-scale))!important;
  line-height:calc(27px * var(--a11y-scale))!important;
}
@media (min-width:1920px){
  body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,.sticky-social-menu,footer,.comments-area,.post-navigation,.elementor,.cky-consent-container,.cky-modal,.cky-preference-center) :where(p,li){
    font-size:calc(25px * var(--a11y-scale))!important;
    line-height:calc(34px * var(--a11y-scale))!important;
  }
}

body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,.sticky-social-menu,footer,.comments-area,.post-navigation,.elementor,.cky-consent-container,.cky-modal,.cky-preference-center) :where(label,legend,code,pre,dd,dt,span,blockquote){
  font-size:inherit!important;
  /* `body, p, li { line-height:27px }` is a flat pixel value, so without
     this a 30px paragraph kept a 27px leading and the lines overlapped.
     Inheriting picks up the root's scaled 27px instead; anything with a
     leading of its own is restated with a scaled one in Section 5. */
  line-height:inherit!important;
}

/* Headings: the plugin also multiplies h1–h6 (and `h_ span`, which stacked
   another ~1.7x on top). These are the effective site-wide defaults
   (bootstrap wins over Twenty Twenty-One here); anything with its own rule
   is restated in Section 5 and out-ranks this fallback. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,footer,.comments-area,.elementor) h1{font-size:calc(36px * var(--a11y-scale-lg))!important;}
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,footer,.comments-area,.elementor) h2{font-size:calc(30px * var(--a11y-scale))!important;}
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,footer,.comments-area,.elementor) h3{font-size:calc(24px * var(--a11y-scale))!important;}
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,footer,.comments-area,.elementor) h4{font-size:calc(18px * var(--a11y-scale))!important;}
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,footer,.comments-area,.elementor) h5{font-size:calc(16px * var(--a11y-scale))!important;}
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,footer,.comments-area,.elementor) h6{font-size:calc(14px * var(--a11y-scale))!important;}

/* ==========================================================================
   SECTION 4 — form controls, buttons and messages
   These are the smallest text on the site (the consent label is 12px, the
   privacy link 11px) and they are the ones the plugin breaks hardest, so
   they ride the steeper --a11y-scale-form curve and get a readability
   floor. Everything here is still gated, so the default render is
   untouched.
   ========================================================================== */

/* Text controls. Excluded from Section 3 on purpose — the plugin scales
   them directly and CF7's span nesting turned 19px into 160px at step 200. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,footer,.comments-area,.elementor) :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="search"],input[type="number"],input[type="password"],input[type="date"],select,textarea){
  font-size:calc(max(16px,19px) * var(--a11y-scale-form))!important;
  line-height:1.5!important;
  box-sizing:border-box!important;
}
/* The textarea is a fixed 170px box in the theme; grow it with the type so
   the same number of lines stays visible. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.elementor) .contact_left textarea,
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.elementor) .contact_1 textarea{
  height:calc(170px * var(--a11y-scale-form))!important;
}

/* Submit / CTA labels.
   Bare `button` is deliberately NOT in this list: on this site every
   <button> is an icon box (owl arrows and dots, the sub-menu toggle, the
   CookieYes buttons, the audio play toggle) with its own pixel size and
   `font-size:0`. They inherit the scaled root instead and keep their shape. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,footer,.elementor) :is(input[type="submit"],input[type="button"],input[type="reset"],.wpcf7-submit,.submit_class,.global-btn){
  font-size:calc(max(16px,25px) * var(--a11y-scale-form))!important;
  line-height:1.2!important;
  white-space:normal!important;
}
/* The CF7 submit is pinned to `height:60px` in the theme's own
   accessibility.php, so at step 200 an 80px label sat inside a 60px box and
   clipped. Height now rides the same curve as the label, which is what
   keeps the button and the fields growing together. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,footer,.elementor) :is(input[type="submit"],.wpcf7-submit,.submit_class){
  height:calc(60px * var(--a11y-scale-form))!important;
  min-height:calc(60px * var(--a11y-scale-form))!important;
  padding-top:0!important;
  padding-bottom:0!important;
  box-sizing:border-box!important;
}

/* Checkboxes and radios: the plugin scales `input`, and on forms without
   an explicit box size the control ballooned with the font. Pin the box to
   the form curve so it stays square, tappable and aligned. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,footer,.elementor) :is(input[type="checkbox"],input[type="radio"]){
  font-size:calc(13px * var(--a11y-scale-form))!important;
  width:calc(20px * var(--a11y-scale-form))!important;
  height:calc(20px * var(--a11y-scale-form))!important;
  min-width:calc(20px * var(--a11y-scale-form))!important;
  flex:0 0 auto!important;
}

/* Labels next to the controls. `label` is in the plugin's list and was
   flattened in Section 3; give it its designed size back on the form curve. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,footer,.elementor) :is(label,legend){
  font-size:calc(max(14px,16px) * var(--a11y-scale-form))!important;
  line-height:1.45!important;
}
body[class*="pojo-a11y-resize-font-"] .contact_1 label{font-size:calc(20px * var(--a11y-scale-form))!important;}
body[class*="pojo-a11y-resize-font-"] .contact_1 .wpcf7-checkbox label{font-size:calc(max(13px,12px) * var(--a11y-scale-form))!important;}

/* CF7 consent-label spans (`p > span > span > span > span`) — the worst
   compounding case on the site: 12px -> 1280px at step 200. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.elementor) :is(.wpcf7-list-item-label,.custom-check-label){
  font-size:calc(13px * var(--a11y-scale-form))!important;
  line-height:1.45!important;
  display:inline-block!important;
}
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.elementor) .privacy-form-text{
  font-size:calc(13px * var(--a11y-scale-form))!important;
  line-height:1.45!important;
}

/* Validation tips. `.wpcf7-not-valid-tip` is `font-size:1em` in CF7 and
   18px in accessibility.php; it is `position:static` on this site (checked
   on the consent row and on a plain text field at 375 and 1440), so there
   is no fixed px anchor to repair — it only needs a real size, a unitless
   line-height and room to wrap inside the `fit-content` flex wrap. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.elementor) .wpcf7-not-valid-tip{
  font-size:calc(max(14px,18px) * var(--a11y-scale-form))!important;
  line-height:1.4!important;
  display:block!important;
  white-space:normal!important;
  width:auto!important;
  max-width:100%!important;
}
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.elementor) :is(.privacy-checkbox,.custom-form .wpcf7-list-item,.english-form-checkbox) .wpcf7-form-control-wrap:has(.wpcf7-not-valid-tip){
  width:100%!important;
  max-width:100%!important;
}
/* Give the consent row spare room so the wrapped tip can never be drawn on
   top of the label text it belongs to. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.elementor) .privacy-checkbox{
  padding-bottom:calc(18px * var(--a11y-scale-form) * 1.5 + 6px)!important;
  flex-wrap:wrap!important;
}

/* Response output. It is `position:absolute; bottom:-54px` with a fixed
   18px type; neither moved at any step. Only the TYPE is put on the form
   curve here - the positioning is handled in Section 9, which takes the
   message out of absolute positioning altogether. Scaling its `bottom`
   alongside the type was the earlier attempt and it cannot work: `bottom`
   pins the message's FOOT to a point below the column, so every extra line
   it wraps to grows upwards into the quote, and the number of lines
   depends on the step, the language and the viewport all at once. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.elementor) .wpcf7-response-output{
  font-size:calc(max(14px,18px) * var(--a11y-scale-form))!important;
  line-height:1.4!important;
  max-width:100%!important;
  white-space:normal!important;
}
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.elementor) .wpcf7 form.sent .wpcf7-response-output{
  font-size:calc(max(14px,22px) * var(--a11y-scale-form))!important;
}
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.elementor) .wpcf7 .screen-reader-response{font-size:calc(16px * var(--a11y-scale-form))!important;}

/* ==========================================================================
   SECTION 4d — the toolbar's own type

   The one deliberate exception to RULE B. The plugin scales its OWN panel
   with the resize steps, and it scales it hard: the two spans inside each
   item go from 15.2px to 30.4px at step 200 and the icon from 23px to 46px,
   so every label wraps and the panel grows from 403px to 850px tall — on a
   360px phone it fills the screen. The panel is a fixed 180px column, so it
   cannot absorb a doubling the way body copy can.

   The size lives on the two spans, not on the anchor, which is why setting
   the anchor's font-size alone does nothing.

   Damped onto --a11y-scale-lg, the same curve the display type uses (1.00 →
   1.35), rather than pinned to a fixed px: the panel must still respond to
   the control the user just pressed, only less than 2x. Measured at 1400px:

     step 200   before  span 30.4px, icon 46px, panel 850px
                after   span 20.5px, icon 31px, panel 497px

   The base value is 15.2px, i.e. exactly what the panel measures with no
   option selected, so RULE A still holds — nothing changes until a mode is
   on. Gated on `pojo-a11y-` rather than `pojo-a11y-resize-font-` so the
   var() is always resolvable inside a mode.
   ========================================================================== */
body[class*="pojo-a11y-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a,
body[class*="pojo-a11y-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a span{
  font-size:calc(15.2px * var(--a11y-scale-lg,1))!important;
}
body[class*="pojo-a11y-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a svg{
  width:calc(23px * var(--a11y-scale-lg,1))!important;
  height:auto!important;
}

/* ==========================================================================
   SECTION 4b — privacy modal (#privacyModal.privacy-wrapper)
   Present on all 83 URLs. Its site CSS is the only vw-sized block on the
   site and it uses `:where(p, li, a)`, which carries ZERO specificity, so
   it loses to the generic rules above and would have been flattened.
   Restated explicitly with `:is()` and given a readability floor: 0.9vw is
   ~9px on a 1000px-wide tablet.
   ========================================================================== */
body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content h2{
  font-size:calc(max(20px,1.4vw) * var(--a11y-scale))!important;line-height:1.3!important;
}
body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content :is(p,li,a,span,strong,em){
  font-size:calc(max(14px,0.9vw) * var(--a11y-scale))!important;line-height:1.55!important;
}
@media (max-width:600px){
  body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content h2{font-size:calc(16px * var(--a11y-scale))!important;}
  body[class*="pojo-a11y-resize-font-"] .privacy-wrapper .privacy-content :is(p,li,a,span,strong,em){font-size:calc(max(13px,12px) * var(--a11y-scale))!important;}
}

/* ==========================================================================
   SECTION 4c — CookieYes banner (.cky-*)
   The banner is appended straight to <body>, i.e. OUTSIDE every content
   root, so the inherit-fix in Section 3 can never reach it. `.cky-btn` is
   also a <button>, which is not in the plugin's selector list at all, so
   the accept button never moved at any step. Every pin below is
   calc(px * var(…)) — flat pixels here would freeze the banner instead.
   ========================================================================== */
body[class*="pojo-a11y-resize-font-"] :is(.cky-consent-container,.cky-modal,.cky-preference-center) :is(p,li,span,label,a,div){font-size:inherit!important;}
body[class*="pojo-a11y-resize-font-"] .cky-notice .cky-notice-group :is(.cky-notice-des > p,.cky-notice-des a,.cky-notice-des){
  font-size:calc(max(14px,0.9vw) * var(--a11y-scale-form))!important;line-height:1.5!important;
}
body[class*="pojo-a11y-resize-font-"] .cky-btn,
body[class*="pojo-a11y-resize-font-"] .cky-consent-container .cky-btn,
body[class*="pojo-a11y-resize-font-"] .cky-modal .cky-btn{
  font-size:calc(max(15px,1vw) * var(--a11y-scale-form))!important;line-height:1.3!important;height:auto!important;min-height:0!important;white-space:normal!important;
}
body[class*="pojo-a11y-resize-font-"] :is(.cky-title,.cky-preference-title,.cky-accordion-btn,.cky-preference-header .cky-btn-close,.cky-switch,.cky-always-active,.cky-accordion-header-des,.cky-gpc-wrapper .cky-gpc-desc){
  font-size:calc(15px * var(--a11y-scale-form))!important;line-height:1.5!important;
}
@media (max-width:600px){
  body[class*="pojo-a11y-resize-font-"] .cky-notice .cky-notice-group :is(.cky-notice-des > p,.cky-notice-des a,.cky-notice-des){font-size:calc(max(13px,11px) * var(--a11y-scale-form))!important;}
  body[class*="pojo-a11y-resize-font-"] .cky-btn,
  body[class*="pojo-a11y-resize-font-"] .cky-consent-container .cky-btn,
  body[class*="pojo-a11y-resize-font-"] .cky-modal .cky-btn{font-size:calc(max(13px,12px) * var(--a11y-scale-form))!important;}
}


/* ==========================================================================
   SECTION 4e — the second consent banner (#cc-banner-root, .cc-*)

   A different widget from the CookieYes one in 4c, injected by a vendor
   script that also writes its own <style id="cc-style"> late in the head.
   Like 4c it is appended straight to <body>, outside every content root.

   Measured on /פרויקטים/, no mode vs step 200:

     .cc-title          16px  ->  37.24px   scaled, but by a curve of its own
     .cc-body           19px  ->  28px      scaled, line-height STAYS 27px
     .cc-body a         19px  ->  28px      same
     .cc-btn            14px  ->  14px      frozen
     .cc-btn-text       14px  ->  14px      frozen
     .cc-lang-toggle    12px  ->  12px      frozen

   So the three action buttons and the language toggle never moved at any
   step - that is the report - and the body copy grew inside a line box that
   did not, which overlaps its own lines. Everything is put on
   --a11y-scale-form, the curve this file already reserves for "form
   controls, buttons, messages and the cookie banner", with unitless
   line-heights so the boxes grow with the type.

   After: title 28px, body 33.25px (line-height 49.9), buttons 24.5px,
   toggle 21px. The banner grows from 331px to 537px tall, which still fits
   a 360x640 phone with the buttons on screen; the max-height is there for
   anything shorter, so the accept button can never end up below the fold.
   ========================================================================== */
body[class*="pojo-a11y-resize-font-"] #cc-banner-root .cc-title{
  font-size:calc(16px * var(--a11y-scale-form))!important;line-height:1.3!important;
}
body[class*="pojo-a11y-resize-font-"] #cc-banner-root :is(.cc-body,.cc-body p,.cc-body a){
  font-size:calc(19px * var(--a11y-scale-form))!important;line-height:1.5!important;
}
body[class*="pojo-a11y-resize-font-"] #cc-banner-root .cc-btn{
  font-size:calc(14px * var(--a11y-scale-form))!important;line-height:1.3!important;
  height:auto!important;min-height:0!important;white-space:normal!important;
}
body[class*="pojo-a11y-resize-font-"] #cc-banner-root .cc-lang-toggle{
  font-size:calc(12px * var(--a11y-scale-form))!important;line-height:1.3!important;height:auto!important;
}
body[class*="pojo-a11y-resize-font-"] #cc-banner-root .cc-banner{
  max-height:calc(100vh - 40px)!important;overflow-y:auto!important;
}


/* ==========================================================================
   SECTION 5 - the theme's own type scale, restated once per breakpoint.
   Generated from commonstyle.css + responsive.css + the site's Additional
   CSS by resolving the real cascade at every breakpoint the site uses
   (0/360/375/414/482/600/768/992/1024/1200/1280/1366/1440/1600/1920), so
   overlapping bands such as `(min-width:1024px) and (max-width:1199px)`
   versus `only screen and (max-width:1920px)` resolve exactly as they do
   today. Line-heights declared in px next to a size are scaled with it -
   otherwise the lines overlap as soon as the type grows.
   ========================================================================== */
body[class*="pojo-a11y-resize-font-"] .elementor-widget-heading .elementor-heading-title.elementor-size-small{font-size:calc(15px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .elementor-widget-heading .elementor-heading-title.elementor-size-medium{font-size:calc(19px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .elementor-widget-heading .elementor-heading-title.elementor-size-large{font-size:calc(29px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .elementor-widget-heading .elementor-heading-title.elementor-size-xl{font-size:calc(39px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .elementor-widget-heading .elementor-heading-title.elementor-size-xxl{font-size:calc(59px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .cross-open-sty{font-size:calc(22px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .cross-close-sty{font-size:calc(22px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .video-title-1 span{font-size:calc(45px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .acf-map .info_bubble{font-size:calc(14px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .size-50 .elementor-heading-title{font-size:calc(50px * var(--a11y-scale-lg))!important;line-height:calc(73px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] #breadcrumbs{font-size:calc(14.5px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .menu-social-icon-container li a{font-size:calc(22px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .menu-social-english-icon-container li a{font-size:calc(22px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .menu-social-icon-english-container .fa:before{font-size:calc(18px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] a.elementor-button-link{font-size:calc(25px * var(--a11y-scale-form))!important;line-height:calc(27px * var(--a11y-scale-form))!important}
body[class*="pojo-a11y-resize-font-"] .icon_blogs1 .elementor-column h3.elementor-heading-title{font-size:calc(24px * var(--a11y-scale))!important;line-height:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .submit-beforespan{font-size:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .contact_form_english .submit-beforespan{font-size:calc(26px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .footer_page .menu-social-english-icon-container li:before{font-size:calc(23px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .team-flex h1{font-size:calc(70px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .readmoretoggle .elementor-tab-title::after{font-size:calc(16px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .readmoretoggle .elementor-tab-content .read-less{font-size:calc(16px * var(--a11y-scale))!important;line-height:calc(16px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .player-controls small{font-size:calc(16px * var(--a11y-scale))!important}
/* `.video-title-1` is `class="video-title video-title-1"`, so this generic
   rule matches the big 45px pull-quote too. Both selectors score (0,2,2),
   and this one is written later, so without the `:not()` it SHADOWED the
   45px rule 16 lines above and the quote fell from 45px to 17px * scale -
   i.e. the type got SMALLER the moment a step was chosen (measured on
   /en/projects/noy-at-levinsky-street-tel-aviv/: 45px -> 19.55px at 130,
   still only 27.2px at 200). The site's own sheets get away with the same
   pair purely because their 45px rule happens to be written last. */
body[class*="pojo-a11y-resize-font-"] .video-title:not(.video-title-1) span{font-size:calc(17px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project-logo span{font-size:calc(22px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .counter-blogs .elementor-heading-title{font-size:calc(22px * var(--a11y-scale))!important;line-height:calc(24px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .counter-blogs .elementor-counter-title{font-size:calc(22px * var(--a11y-scale))!important;line-height:calc(24px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .counter-blogs .elementor-widget-text-editor p{font-size:calc(64px * var(--a11y-scale-lg))!important;line-height:calc(58px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .landingpage-sec1 h2{font-size:calc(40.5px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .center-projectitle .common-head .elementor-heading-title{font-size:calc(46px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] header .primary-navigation .primary-menu-container > ul .sub-menu .menu-item a{font-size:calc(17px * var(--a11y-scale))!important;line-height:calc(18px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .primary-navigation.hash-header .primary-menu-container > ul .menu-phone > a{font-size:calc(35px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .primary-navigation.hash-header .primary-menu-container > ul .menu-phone > a::after{font-size:calc(44px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .footer_page .primary-menu-container > ul .menu-phone > a::after{font-size:calc(37px * var(--a11y-scale))!important}
@media (max-width:1919px){
body[class*="pojo-a11y-resize-font-"] .elementor-widget-text-editor p{font-size:calc(19px * var(--a11y-scale))!important;line-height:calc(27px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .elementor-widget-text-editor{font-size:calc(19px * var(--a11y-scale))!important;line-height:calc(27px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"].en_US .project_description span{font-size:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .contact-right h1{font-size:calc(54px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .contact-right h2{font-size:calc(54px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .contact_left input.submit_class{font-size:calc(22px * var(--a11y-scale-form))!important}
body[class*="pojo-a11y-resize-font-"] .footer_page .menu-social-icon-container li:before{font-size:calc(23px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .team-flex h2{font-size:calc(40px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .teams-col span{font-size:calc(22px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project-line span{font-size:calc(19px * var(--a11y-scale))!important}
}
@media (max-width:1599px){
body[class*="pojo-a11y-resize-font-"].en_US .project_description p{font-size:calc(18px * var(--a11y-scale))!important}
}
@media (max-width:767px){
body[class*="pojo-a11y-resize-font-"] .primary-navigation .primary-menu-container > ul > .menu-item > a{font-size:calc(22px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .menu-social-icon-container .fa:before{font-size:calc(25px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .banner_description h2{font-size:calc(33px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .banner_description p{font-size:calc(16px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project-title h2{font-size:calc(22px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project_description span{font-size:calc(25px * var(--a11y-scale))!important;line-height:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .icon_blogs1 .elementor-column h2.elementor-heading-title{font-size:calc(20px * var(--a11y-scale))!important;line-height:calc(23px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .contact-right p{font-size:calc(21px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .submit-before h2{font-size:calc(21px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .footer_page .primary-menu-container > ul a{font-size:calc(21px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .footer-address p{font-size:calc(19px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .team_listtitle h2.elementor-heading-title{font-size:calc(27px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .newspancls span.elementor-heading-title.elementor-size-default{font-size:calc(27px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .green-player h3{font-size:calc(20px * var(--a11y-scale))!important;line-height:calc(24px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .green-feature-desc p{font-size:calc(15px * var(--a11y-scale))!important;line-height:calc(17px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project-line h1{font-size:calc(37px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project-line h2{font-size:calc(37px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .video-title h2{font-size:calc(28px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .banner_description strong:after{font-size:calc(34px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .banner_description strong:before{font-size:calc(34px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .green-slider-content h2{font-size:calc(24px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .green-slider-content p{font-size:calc(16px * var(--a11y-scale))!important;line-height:calc(24px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project-tag{font-size:calc(18px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project_description p{font-size:calc(16px * var(--a11y-scale))!important;line-height:calc(23px * var(--a11y-scale))!important}
}
@media (min-width:768px){
body[class*="pojo-a11y-resize-font-"] .banner_description h2{font-size:calc(54px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .banner_description p{font-size:calc(18px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .banner_description strong:after{font-size:calc(54px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .banner_description strong:before{font-size:calc(54px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .project-tag{font-size:calc(20px * var(--a11y-scale))!important;line-height:calc(20px * var(--a11y-scale))!important}
}
@media (min-width:768px) and (max-width:1919px){
body[class*="pojo-a11y-resize-font-"] .menu-social-icon-container .fa:before{font-size:calc(18px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .footer_page .primary-menu-container > ul a{font-size:calc(24px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .footer-address p{font-size:calc(21px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project-line h1{font-size:calc(47px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .project-line h2{font-size:calc(47px * var(--a11y-scale-lg))!important}
}
@media (min-width:768px) and (max-width:1023px){
body[class*="pojo-a11y-resize-font-"] .project-title h2{font-size:calc(28px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project_description span{font-size:calc(40px * var(--a11y-scale-lg))!important;line-height:calc(38px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .icon_blogs1 .elementor-column h2.elementor-heading-title{font-size:calc(19px * var(--a11y-scale))!important;line-height:calc(23px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .contact-right p{font-size:calc(19px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .submit-before h2{font-size:calc(28px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .team_listtitle h2.elementor-heading-title{font-size:calc(42px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .newspancls span.elementor-heading-title.elementor-size-default{font-size:calc(42px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .green-player h3{font-size:calc(30px * var(--a11y-scale))!important;line-height:calc(32px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .green-feature-desc p{font-size:calc(21px * var(--a11y-scale))!important;line-height:calc(24px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .video-title h2{font-size:calc(33px * var(--a11y-scale))!important}
}
@media (min-width:768px) and (max-width:991px){
body[class*="pojo-a11y-resize-font-"] .primary-navigation .primary-menu-container > ul > .menu-item > a{font-size:calc(18px * var(--a11y-scale))!important}
}
@media (min-width:992px){
body[class*="pojo-a11y-resize-font-"] .primary-navigation .primary-menu-container > ul > .menu-item > a{font-size:calc(22px * var(--a11y-scale))!important}
}
@media (min-width:1024px){
body[class*="pojo-a11y-resize-font-"].he_IL .banner_description p{font-size:calc(16px * var(--a11y-scale))!important}
}
@media (min-width:1024px) and (max-width:1919px){
body[class*="pojo-a11y-resize-font-"] .icon_blogs1 .elementor-column h2.elementor-heading-title{font-size:calc(24px * var(--a11y-scale))!important;line-height:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .contact-right p{font-size:calc(21px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .team_listtitle h2.elementor-heading-title{font-size:calc(55px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .newspancls span.elementor-heading-title.elementor-size-default{font-size:calc(55px * var(--a11y-scale-lg))!important;line-height:calc(55px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"].he_IL .banner_description h2{font-size:calc(34px * var(--a11y-scale))!important;line-height:calc(34px * var(--a11y-scale))!important}
}
@media (min-width:1024px) and (max-width:1199px){
body[class*="pojo-a11y-resize-font-"] .project-title h2{font-size:calc(20px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project_description span{font-size:calc(32px * var(--a11y-scale))!important;line-height:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .submit-before h2{font-size:calc(26px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .green-player h3{font-size:calc(26px * var(--a11y-scale))!important;line-height:calc(28px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .green-feature-desc p{font-size:calc(16px * var(--a11y-scale))!important;line-height:calc(20px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .green .project-title h2{font-size:calc(20px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .video-title h2{font-size:calc(37px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"].en_US .newspancls span.elementor-heading-title.elementor-size-default{font-size:calc(40px * var(--a11y-scale-lg))!important;line-height:calc(48px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .cuswidth.newspancls span.elementor-heading-title.elementor-size-default{font-size:calc(52px * var(--a11y-scale-lg))!important;line-height:calc(52px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"].en_US .banner_description h2{font-size:calc(38px * var(--a11y-scale))!important;line-height:calc(38px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"].en_US .banner_description strong:before{font-size:calc(38px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"].en_US .banner_description strong:after{font-size:calc(38px * var(--a11y-scale))!important}
}
@media (min-width:1200px){
body[class*="pojo-a11y-resize-font-"] .green-player h3{font-size:calc(30px * var(--a11y-scale))!important;line-height:calc(32px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .green-feature-desc p{font-size:calc(21px * var(--a11y-scale))!important;line-height:calc(24px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"].en_US .newspancls span.elementor-heading-title.elementor-size-default{font-size:calc(27px * var(--a11y-scale))!important;line-height:calc(47px * var(--a11y-scale))!important}
}
@media (min-width:1200px) and (max-width:1919px){
body[class*="pojo-a11y-resize-font-"] .project-title h2{font-size:calc(28px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project_description span{font-size:calc(40px * var(--a11y-scale-lg))!important;line-height:calc(38px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .submit-before h2{font-size:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .video-title h2{font-size:calc(45px * var(--a11y-scale-lg))!important}
}
@media (min-width:1200px) and (max-width:1599px){
body[class*="pojo-a11y-resize-font-"] .cuswidth.newspancls span.elementor-heading-title.elementor-size-default{font-size:calc(48px * var(--a11y-scale-lg))!important;line-height:calc(48px * var(--a11y-scale-lg))!important}
}
@media (min-width:1200px) and (max-width:1365px){
body[class*="pojo-a11y-resize-font-"] .green .project-title h2{font-size:calc(24px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"].en_US .banner_description h2{font-size:calc(42px * var(--a11y-scale-lg))!important;line-height:calc(42px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"].en_US .banner_description strong:before{font-size:calc(42px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"].en_US .banner_description strong:after{font-size:calc(42px * var(--a11y-scale-lg))!important}
}
@media (min-width:1366px) and (max-width:1439px){
body[class*="pojo-a11y-resize-font-"] .green .project-title h2{font-size:calc(26px * var(--a11y-scale))!important}
}
@media (min-width:1600px){
body[class*="pojo-a11y-resize-font-"].en_US .project_description p{font-size:calc(24px * var(--a11y-scale))!important}
}
@media (min-width:1920px){
body[class*="pojo-a11y-resize-font-"] .elementor-widget-text-editor p{font-size:calc(25px * var(--a11y-scale))!important;line-height:calc(34px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .elementor-widget-text-editor{font-size:calc(25px * var(--a11y-scale))!important;line-height:calc(34px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .menu-social-icon-container .fa:before{font-size:calc(25px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project-title h2{font-size:calc(37.5px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project_description span{font-size:calc(58px * var(--a11y-scale-lg))!important;line-height:calc(58px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"].en_US .project_description span{font-size:calc(48px * var(--a11y-scale-lg))!important;line-height:calc(48px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .icon_blogs1 .elementor-column h2.elementor-heading-title{font-size:calc(29px * var(--a11y-scale))!important;line-height:calc(34px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .contact-right h1{font-size:calc(88px * var(--a11y-scale-lg))!important;line-height:calc(84px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .contact-right h2{font-size:calc(88px * var(--a11y-scale-lg))!important;line-height:calc(84px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .contact-right p{font-size:calc(21px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .contact_left input.submit_class{font-size:calc(25px * var(--a11y-scale-form))!important}
body[class*="pojo-a11y-resize-font-"] .submit-before h2{font-size:calc(37px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .footer_page .primary-menu-container > ul a{font-size:calc(29px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .footer-address p{font-size:calc(25px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .footer_page .menu-social-icon-container li:before{font-size:calc(26px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .team-flex h2{font-size:calc(83px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .team_listtitle h2.elementor-heading-title{font-size:calc(66px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .newspancls span.elementor-heading-title.elementor-size-default{font-size:calc(66px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .teams-col span{font-size:calc(25px * var(--a11y-scale))!important;line-height:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .project-line h1{font-size:calc(66px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .project-line h2{font-size:calc(66px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .project-line span{font-size:calc(25px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .video-title h2{font-size:calc(54.17px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"].he_IL .banner_description h2{font-size:calc(54px * var(--a11y-scale-lg))!important;line-height:calc(54px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .link-go strong{font-size:calc(16px * var(--a11y-scale))!important;line-height:calc(15px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .font60 .common-head .elementor-heading-title{font-size:calc(66px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .center-projectitle .font-66 .elementor-heading-title{font-size:calc(66px * var(--a11y-scale-lg))!important;line-height:calc(66px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .font-66 .elementor-heading-title{font-size:calc(66px * var(--a11y-scale-lg))!important;line-height:calc(66px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .cuswidth.newspancls span.elementor-heading-title.elementor-size-default{font-size:calc(48px * var(--a11y-scale-lg))!important;line-height:calc(56px * var(--a11y-scale-lg))!important}
}


/* --------------------------------------------------------------------------
   SECTION 5c — the per-widget overrides that live in the site's custom CSS
   (Appearance → Additional CSS), not in the theme files. They target
   individual Elementor widgets at 414/375/360px, which is below every
   breakpoint the theme itself uses.
   -------------------------------------------------------------------------- */
@media only screen and (max-width:414px){
  body[class*="pojo-a11y-resize-font-"] .elementor-37 .elementor-element.elementor-element-b8c6260 .elementor-heading-title{font-size:calc(21px * var(--a11y-scale))!important}
  body[class*="pojo-a11y-resize-font-"] .elementor-37 .elementor-element.elementor-element-fd085db .elementor-heading-title{font-size:calc(23px * var(--a11y-scale))!important}
  body[class*="pojo-a11y-resize-font-"] .elementor-37 .elementor-element.elementor-element-18feaa8 .elementor-heading-title{font-size:calc(23px * var(--a11y-scale))!important}
  body[class*="pojo-a11y-resize-font-"] .elementor-37 .elementor-element.elementor-element-ebc1a69 .elementor-heading-title{font-size:calc(22px * var(--a11y-scale))!important;line-height:1.4em!important}
}
@media only screen and (max-width:375px){
  body[class*="pojo-a11y-resize-font-"] .elementor-37 .elementor-element.elementor-element-ebc1a69 .elementor-heading-title{font-size:calc(21px * var(--a11y-scale))!important;line-height:1.4em!important}
  body[class*="pojo-a11y-resize-font-"] .elementor-37 .elementor-element.elementor-element-18feaa8 .elementor-heading-title{font-size:calc(20px * var(--a11y-scale))!important}
  body[class*="pojo-a11y-resize-font-"] .elementor-37 .elementor-element.elementor-element-fd085db .elementor-heading-title{font-size:calc(21px * var(--a11y-scale))!important}
  body[class*="pojo-a11y-resize-font-"] .elementor-37 .elementor-element.elementor-element-b8c6260 .elementor-heading-title{font-size:calc(20px * var(--a11y-scale))!important}
}
@media only screen and (max-width:360px){
  body[class*="pojo-a11y-resize-font-"] .elementor-37 .elementor-element.elementor-element-ebc1a69 .elementor-heading-title{font-size:calc(20px * var(--a11y-scale))!important}
}
@media only screen and (min-width:1920px){
  body[class*="pojo-a11y-resize-font-"] .elementor-767 .elementor-element.elementor-element-46e65c6 .elementor-toggle-title,
  body[class*="pojo-a11y-resize-font-"] .elementor-1776 .elementor-element.elementor-element-e1939ef .elementor-toggle-title{font-size:calc(25px * var(--a11y-scale))!important}
}


/* --------------------------------------------------------------------------
   SECTION 5d — Twenty Twenty-One template chrome.
   The 43 project pages, the 14 press pages and the 2 slider pages are not
   Elementor: they render through the parent theme's own markup, which is
   sized from TT1's rem-based custom properties rather than from
   commonstyle.css.

   Each rule MULTIPLIES the theme's own variable rather than restating a
   pixel value, because several of those variables are themselves
   responsive: `--global--font-size-page-title` is 4rem on a phone and 6rem
   on a desktop. An earlier version of this block hard-coded 40px and made
   the page title SHRINK from 60px to 54px at 1440px. Multiplying the
   variable tracks whatever the parent theme does, at every breakpoint,
   without this file having to know where those breakpoints are.

   The block matters more than its size suggests: the page title on those
   59 URLs is a `<p class="entry-title">`, i.e. an element Section 3 used to
   flatten, so without a restatement it fell to body size the moment a step
   was selected — measured at 375px, 40px -> 30.4px at step 200.

   `.singular`, `.error404` and `.archive` sit on <body>, so the gate is
   merged into those compound selectors instead of prefixed as an ancestor.
   The `max()` floors apply only while a step is selected; the default
   render is untouched.
   -------------------------------------------------------------------------- */
body[class*="pojo-a11y-resize-font-"] .entry-title{font-size:calc(var(--entry-header--font-size,2.25rem) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"].singular .entry-title{font-size:calc(var(--global--font-size-page-title,4rem) * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .page-title{font-size:calc(var(--global--font-size-page-title,4rem) * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] .archive-description{font-size:calc(var(--entry-header--font-size,2.25rem) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"].error404 main p{font-size:calc(max(14px,var(--global--font-size-lg,1.5rem)) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .post-password-message{font-size:calc(max(14px,var(--global--font-size-lg,1.5rem)) * var(--a11y-scale))!important}

body[class*="pojo-a11y-resize-font-"] .entry-footer{font-size:calc(max(13px,var(--global--font-size-xs,1rem)) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .widget-area{font-size:calc(max(14px,var(--global--font-size-sm,1.125rem)) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .widget-title{font-size:calc(max(14px,var(--global--font-size-sm,1.125rem)) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .site-footer > .site-info{font-size:calc(max(14px,var(--global--font-size-sm,1.125rem)) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .site-footer > .site-info .site-name{font-size:calc(var(--global--font-size-lg,1.5rem) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .site-description{font-size:calc(max(14px,var(--global--font-size-sm,1.125rem)) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .menu-item-description{font-size:calc(max(13px,var(--global--font-size-xs,1rem)) * var(--a11y-scale))!important}

body[class*="pojo-a11y-resize-font-"] .post-navigation .post-title{font-size:calc(var(--global--font-size-lg,1.5rem) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .pagination .nav-links > *{font-size:calc(var(--global--font-size-lg,1.5rem) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .comments-pagination .nav-links > *{font-size:calc(max(14px,var(--global--font-size-md,1.25rem)) * var(--a11y-scale))!important}

body[class*="pojo-a11y-resize-font-"] .comments-title,
body[class*="pojo-a11y-resize-font-"] .comment-reply-title{font-size:calc(var(--entry-header--font-size,2.25rem) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .comment .comment-respond .comment-reply-title{font-size:calc(var(--global--font-size-lg,1.5rem) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .comment-meta .comment-author .fn{font-size:calc(var(--global--font-size-lg,1.5rem) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .comment-meta .comment-metadata{font-size:calc(max(13px,var(--global--font-size-xs,1rem)) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .reply{font-size:calc(max(14px,var(--global--font-size-sm,1.125rem)) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .comment-form .comment-notes{font-size:calc(max(13px,var(--global--font-size-xs,1rem)) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .comment-form > p label{font-size:calc(max(14px,11.25px) * var(--a11y-scale-form))!important}

body[class*="pojo-a11y-resize-font-"] .author-bio{font-size:calc(max(13px,var(--global--font-size-xs,1rem)) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .author-bio .author-bio-content .author-title{font-size:calc(var(--global--font-size-lg,1.5rem) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .author-bio .author-bio-content .author-description{font-size:calc(max(13px,var(--global--font-size-xs,1rem)) * var(--a11y-scale))!important}

body[class*="pojo-a11y-resize-font-"] blockquote p{font-size:calc(max(16px,var(--quote--font-size,1.25rem)) * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] blockquote cite,
body[class*="pojo-a11y-resize-font-"] blockquote footer{font-size:calc(max(13px,var(--global--font-size-xs,1rem)) * var(--a11y-scale))!important}


/* ==========================================================================
   SECTION 7 — positioned decorations with a fixed pixel anchor.

   The phone numbers in the header and the footer render their leading "*"
   as an absolutely positioned `::after`, anchored with a hard pixel offset
   (`right:44px` in Hebrew, `left:0` / `left:-20px` elsewhere) that was
   measured against the digits at their design size. Scaling the digits and
   the glyph without moving the anchor walks them into each other.
   Measured in the Hebrew footer at 1280px — gap between the star and the
   first digit: +5px at rest, +2px at 120, -5px at 150, -18px at 200, i.e.
   the star sat on top of the "8".

   Scaling the anchor by the same factor as the type keeps the whole group
   proportional. `height` is scaled for the same reason: the box is centred
   with `top:50%; transform:translateY(-50%)` while the glyph sits at the
   top of a `line-height:normal` line box, so the glyph's offset from centre
   is (-height/2 + halfLineBox). Scaling both terms by --a11y-scale keeps
   that offset exactly proportional and the star stays where it looks today.

   This block has to come AFTER Section 5, which re-points the same
   selectors at the same specificity — source order is what settles it.
   ========================================================================== */

/* Sticky header phone. Section 5 put the 44px glyph on the display curve
   because it is >= 40px; a glyph glued to a 35px number has to ride the
   same curve as the number, or it shrinks relative to it. */
body[class*="pojo-a11y-resize-font-"] .primary-navigation.hash-header .primary-menu-container > ul .menu-phone > a::after{
  font-size:calc(44px * var(--a11y-scale))!important;
  left:calc(-20px * var(--a11y-scale))!important;
  height:calc(20px * var(--a11y-scale))!important;
}

/* Footer phone — shared box. */
body[class*="pojo-a11y-resize-font-"] .footer_page .primary-menu-container > ul .menu-phone > a::after{
  font-size:calc(37px * var(--a11y-scale))!important;
  height:calc(20px * var(--a11y-scale))!important;
}

/* Footer phone, English (LTR): the star sits at `left:0` and the digits are
   held clear of it by `padding-left:18px` on the link. Grow the gutter with
   the glyph. Scoped to .en_US because the Hebrew build zeroes that padding
   and positions from the right instead. */
body[class*="pojo-a11y-resize-font-"].en_US .footer_page .primary-menu-container > ul .menu-phone > a{
  padding-left:calc(18px * var(--a11y-scale))!important;
}

/* Footer phone, Hebrew (RTL): the reported overlap. The digits are flush
   right and grow leftwards, so the star's own right-hand anchor has to
   travel with them. */
body[class*="pojo-a11y-resize-font-"].he_IL .footer_page .primary-menu-container > ul .menu-phone > a::after{
  right:calc(44px * var(--a11y-scale))!important;
}


/* ==========================================================================
   SECTION 7b — the banner attribution line rides the damped curve.

   `.banner_description p` is the credit under the hero quote - on the home
   page, `(מתוך "אלטנוילנד" מאת בנימין זאב הרצל)` - and it is drawn OVER the
   autoplaying banner video. It is a caption, not body copy: nobody reads
   the page through it, it just has to stay legible.

   On the full `--a11y-scale` curve it went 16px -> 25.6px at step 200 and
   the block grew from one line to three (27px -> 86px tall, measured at
   375px), so it took over the middle of the video and collided with the
   quote above it. Section 5 sizes it from the same curve as body copy
   purely because that is what the generator found in the theme's CSS.

   `--a11y-scale-lg` is the curve this sheet already uses for text that is
   allowed to grow more slowly than body copy (see Section 1). Same
   treatment here: the caption still grows at every step - 16px -> 21.6px at
   200, i.e. 135% - so the resize control still does something to it, it
   just stops swallowing the banner. Restated per breakpoint at the same
   specificity as Section 5, and placed after it, exactly like Section 7 -
   source order is what settles it.

   The line-height has to come off the same curve. The theme's base is
   `line-height:27px` next to `font-size:16px`, and Section 3 scales that
   27px on the FULL curve along with every other `p` on the page - so
   damping only the font left a 21.6px caption sitting in a 43.2px line
   box, two lines of which is still 86px of banner. Restating it on
   `--a11y-scale-lg` keeps the caption's own 27/16 proportion intact at
   every step.
   ========================================================================== */
@media (max-width:767px){
body[class*="pojo-a11y-resize-font-"] .banner_description p{
  font-size:calc(16px * var(--a11y-scale-lg))!important;
  line-height:calc(27px * var(--a11y-scale-lg))!important;
}
}
@media (min-width:768px){
body[class*="pojo-a11y-resize-font-"] .banner_description p{
  font-size:calc(18px * var(--a11y-scale-lg))!important;
  line-height:calc(27px * var(--a11y-scale-lg))!important;
}
}
@media (min-width:1024px){
body[class*="pojo-a11y-resize-font-"].he_IL .banner_description p{
  font-size:calc(16px * var(--a11y-scale-lg))!important;
  line-height:calc(27px * var(--a11y-scale-lg))!important;
}
}


/* ==========================================================================
   SECTION 8 — keep the properties this sheet controls out of CSS
   transitions.

   THIS IS THE FIX FOR A WHOLE CLASS OF "IT DIDN'T APPLY" BUGS, not a
   nicety. Elementor declares `transition-property: all` (0.3s / 0.6s) on
   buttons, flip-box layers and images. `all` covers font-size, colour and
   border, so changing a text step or a contrast mode starts transitions on
   those properties — and a RUNNING TRANSITION outranks `!important`; it
   sits above every author declaration in the cascade. On this site those
   transitions never settle: they were still reporting
   `playState: "running"` seconds later, pinning the element at its
   pre-change value.

   Measured on /office-for-rent/ at step 200: sixteen elements frozen,
   `button.elementor-button` stuck at 18px inside a 255x52 box while its
   container had grown to 30.4px — layout agreed with the frozen value, so
   this was real, not a stale readback. Measured on
   /en/projects-in-hod-hasharon/ in high contrast: `a.elementor-button-link`
   held a 3px BLACK border on the black page with twelve transitions
   running (font-size, line-height, color, background-color and all eight
   border-*), even though the only matching rule was this sheet's
   `border:2px solid #fff !important`. Forcing a reflow produced the white
   border immediately.

   Only `transform` and `opacity` stay transitionable — the flip box needs
   transform to flip, fades need opacity, and this sheet never touches
   either, so nothing here can be pinned by them. Colour and size changes
   become instant while an accessibility option is on, which is also the
   behaviour reduced-motion users expect.

   Gated on `pojo-a11y-` rather than `pojo-a11y-resize-font-`, because the
   contrast modes hit the same wall.
   ========================================================================== */
body[class*="pojo-a11y-"] :where(.site,.site-content,.widget-area,.sticky-social-menu,footer,.comments-area,.post-navigation,.elementor,.privacy-wrapper,.cky-consent-container,.cky-modal,.cky-preference-center) *{
  transition-property: transform, translate, rotate, scale, opacity !important;
}


/* ==========================================================================
   SECTION 9 — the contact form's two out-of-flow blocks: the
   closing quote (9a) and the validation summary (9b).

   `.submit-before` (the Herzl quote under the form) is
   `position:absolute; bottom:0`, and `.contact_1 .submit-before` adds
   `top:97%`. Being out of flow, it reserves NO height in `.contact_left`,
   so as the type grows the block gets taller and climbs upwards into the
   form. Measured on /en/projects-in-hod-hasharon/ at step 200: the quote
   ran 4772->4944 (173px tall) while the last consent row ended at 4799 —
   27px of the quote sitting on top of "I have read and agree to the
   privacy policy", and earlier it was landing on the Send button too.

   Reserving a fixed gap cannot work: the block's height depends entirely on
   how the sentence wraps, which changes with the step, the language and the
   viewport. Putting it back in normal flow is what actually guarantees no
   overlap — `.contact_left` then grows to contain it (measured 1137px ->
   1286px) and the quote can never reach the rows above. The submit button
   still floats, so where the browser has room the quote's line boxes wrap
   beside it exactly as they do now; where it does not, the quote drops
   below the button (19px clear) instead of being drawn over it.

   Below 768px the theme already switches this block to `position:relative`
   and centres it, so it is in flow there and needs nothing.
   ========================================================================== */

/* --- 9a. the closing quote ---------------------------------------------- */
@media (min-width:768px){
  body[class*="pojo-a11y-resize-font-"] .contact_left .submit-before{
    position:static!important;
    top:auto!important; bottom:auto!important; left:auto!important; right:auto!important;
    width:auto!important;
    max-width:100%!important;
    margin-top:calc(12px * var(--a11y-scale))!important;
  }
  /* The button has to stay wide enough for its own label once that label
     grows, or the text spills out of the 195px / 150px box. */
  body[class*="pojo-a11y-resize-font-"] .contact_left input.submit_class,
  body[class*="pojo-a11y-resize-font-"] .contact_left input[type="submit"]{
    min-width:calc(195px * var(--a11y-scale-form))!important;
    max-width:100%!important;
  }
  body[class*="pojo-a11y-resize-font-"].en_US .contact_left input.submit_class,
  body[class*="pojo-a11y-resize-font-"].en_US .contact_left input[type="submit"]{
    min-width:calc(150px * var(--a11y-scale-form))!important;
  }
}


/* --- 9b. the validation summary -----------------------------------------
   `.wpcf7-response-output` ("One or more fields have an error…") is the
   SECOND out-of-flow block in this column, and the more damaging of the
   two: commonstyle.css gives it `position:absolute; bottom:-54px`, i.e. it
   reserves no height AND is deliberately pushed 54px below the bottom of
   `.contact_left`. At the site's own type size that lands it just under the
   Send button. Once the type grows it does not move down - it grows UP,
   because `bottom` pins its foot, so every extra line the sentence wraps to
   is added on top of the quote.

   Measured at step 200 with the form in its invalid state, on this page:
     375px  quote 2071-2287, message 2220-2365 -> 67px of the message drawn
            over the quote and 43px hanging past the bottom of the yellow
            block, on top of the footer.
     1280px quote 1772-1901, message 1864-1964 -> 632x38px of overlap and
            23px past the yellow block.
   A sweep of every text box inside `.contact_form_blog` at that step found
   this as the ONLY overlapping pair at either width, so it is the whole of
   the "it's a mess when I increase the fonts" report, not a symptom of it.

   Same remedy as the quote in 9a, and for the same reason: no gap computed
   from the step can be right, because the height depends on how the
   sentence wraps. In flow, `.contact_left` grows to contain the message and
   it can never reach the quote or leave the yellow block. Unlike 9a this
   one is NOT restricted to >=768px - the theme leaves it absolute at every
   width, so the mobile break is the same break.

   Two details the measurements forced. `clear:both`, because on >=768px the
   Send button is `float:right`/`float:left`: without it the message box
   starts level with the button and only its LINE boxes step aside, which
   put 263x34px of it alongside the button at 1280px. And the gap is
   `padding-top`, not `margin-top`: clearance past a float consumes the top
   margin, so the margin version sat flush against the button on desktop
   while showing its 28px on mobile. Padding is not consumed, and the
   element carries no border or background of its own (commonstyle sets
   `border:none!important`), so nothing is drawn in that space. It is on
   the form curve, the same curve the message's own type uses. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.elementor) .wpcf7-response-output{
  position:static!important;
  top:auto!important; bottom:auto!important; left:auto!important; right:auto!important;
  float:none!important; clear:both!important;
  width:auto!important;
  max-width:100%!important;
  margin:0!important;
  padding:calc(16px * var(--a11y-scale-form)) 0 0!important;
  box-sizing:border-box!important;
}

/* Long unbreakable strings are the usual reason a page starts scrolling
   sideways once the type grows, and they are far more common in English
   than in Hebrew (e-mail addresses, hyphenated headlines). Let them break
   rather than push the layout wide. */
body[class*="pojo-a11y-resize-font-"] :where(.site,.site-content,.widget-area,.sticky-social-menu,footer,.comments-area,.post-navigation,.elementor,.privacy-wrapper) :is(h1,h2,h3,h4,h5,h6,p,li,a,span,label,td,th,blockquote,figcaption,legend,div){
  overflow-wrap:break-word!important;
}

}

@layer a11y-el {
/* ==========================================================================
   SECTION 5b - Elementor per-widget typography (23 post-*.css files, 217
   selectors, 38 distinct size/line-height/breakpoint combinations).
   Elementor writes these as plain px on `.elementor-<page>
   .elementor-element-<id>`, which the plugin's `!important` percentages
   simply overwrote; restated here they scale once and keep the page's
   visual hierarchy.
   ========================================================================== */
body[class*="pojo-a11y-resize-font-"] :is(.elementor-1670 .elementor-element.elementor-element-53482aa .elementor-image-box-description,.elementor-1670 .elementor-element.elementor-element-f9cfc0e .elementor-image-box-description,.elementor-1670 .elementor-element.elementor-element-39f162b .elementor-image-box-description,.elementor-1670 .elementor-element.elementor-element-4815065 .elementor-image-box-description,.elementor-1670 .elementor-element.elementor-element-b3298d0 .elementor-image-box-description,.elementor-31 .elementor-element.elementor-element-ccc00e4 .elementor-image-box-description,.elementor-31 .elementor-element.elementor-element-add56a2 .elementor-image-box-description){font-size:calc(16px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-1670 .elementor-element.elementor-element-e650306 .elementor-heading-title){font-size:calc(12px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-1670 .elementor-element.elementor-element-7b83d83 .elementor-heading-title){font-size:calc(28px * var(--a11y-scale))!important;line-height:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-1776 .elementor-element.elementor-element-e1939ef .elementor-tab-content,.elementor-1776 .elementor-element.elementor-element-e1939ef .elementor-toggle-title,.elementor-4960 .elementor-element.elementor-element-e1939ef .elementor-tab-content,.elementor-4960 .elementor-element.elementor-element-e1939ef .elementor-toggle-title,.elementor-4968 .elementor-element.elementor-element-e1939ef .elementor-tab-content,.elementor-4968 .elementor-element.elementor-element-e1939ef .elementor-toggle-title,.elementor-4974 .elementor-element.elementor-element-e1939ef .elementor-tab-content,.elementor-4974 .elementor-element.elementor-element-e1939ef .elementor-toggle-title,.elementor-767 .elementor-element.elementor-element-46e65c6 .elementor-toggle-title){font-size:calc(19px * var(--a11y-scale))!important;line-height:calc(27px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3642 .elementor-element.elementor-element-3ea80ae .elementor-button){font-size:calc(40px * var(--a11y-scale-form))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3642 .elementor-element.elementor-element-509f2ee .elementor-heading-title,.elementor-4271 .elementor-element.elementor-element-269a109 .elementor-heading-title,.elementor-4334 .elementor-element.elementor-element-269a109 .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-e737944 .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-e737944 .elementor-heading-title){font-size:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3642 .elementor-element.elementor-element-49b2026 .elementor-heading-title,.elementor-3642 .elementor-element.elementor-element-53c465e .elementor-heading-title,.elementor-3642 .elementor-element.elementor-element-0c7542a .elementor-heading-title,.elementor-3642 .elementor-element.elementor-element-add3b14 .elementor-heading-title,.elementor-3821 .elementor-element.elementor-element-b78475f,.elementor-3821 .elementor-element.elementor-element-b4c17cb,.elementor-3821 .elementor-element.elementor-element-5351027,.elementor-3821 .elementor-element.elementor-element-2439039 .elementor-flip-box__front .elementor-flip-box__layer__title,.elementor-3821 .elementor-element.elementor-element-782f955 .elementor-flip-box__front .elementor-flip-box__layer__title,.elementor-3821 .elementor-element.elementor-element-b97d791 .elementor-flip-box__front .elementor-flip-box__layer__title,.elementor-4271 .elementor-element.elementor-element-cafc493 .elementor-heading-title,.elementor-4271 .elementor-element.elementor-element-bc3e72a .elementor-heading-title,.elementor-4271 .elementor-element.elementor-element-6badeae .elementor-heading-title,.elementor-4271 .elementor-element.elementor-element-902689f .elementor-heading-title,.elementor-4271 .elementor-element.elementor-element-2d8f041 .elementor-heading-title,.elementor-4271 .elementor-element.elementor-element-c2aad83 .elementor-heading-title,.elementor-4271 .elementor-element.elementor-element-1bb8d0f .elementor-heading-title,.elementor-4334 .elementor-element.elementor-element-cafc493 .elementor-heading-title,.elementor-4334 .elementor-element.elementor-element-bc3e72a .elementor-heading-title,.elementor-4334 .elementor-element.elementor-element-6badeae .elementor-heading-title,.elementor-4334 .elementor-element.elementor-element-902689f .elementor-heading-title,.elementor-4334 .elementor-element.elementor-element-2d8f041 .elementor-heading-title,.elementor-4334 .elementor-element.elementor-element-c2aad83 .elementor-heading-title,.elementor-4334 .elementor-element.elementor-element-1bb8d0f .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-731d9cd .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-82f15d9 .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-6dd593a .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-77b00cc .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-5c0514b .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-86d2048 .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-448ada3 .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-bc405b8 .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-17a0429 .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-3a110b0 .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-e7fbf2a .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-bfde543 .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-888c2f7 .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-4b099fa .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-3764dba .elementor-heading-title,.elementor-5189 .elementor-element.elementor-element-f7edc94 .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-731d9cd .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-82f15d9 .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-6dd593a .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-77b00cc .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-5c0514b .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-86d2048 .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-448ada3 .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-bc405b8 .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-17a0429 .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-3a110b0 .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-e7fbf2a .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-bfde543 .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-888c2f7 .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-4b099fa .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-3764dba .elementor-heading-title,.elementor-5220 .elementor-element.elementor-element-f7edc94 .elementor-heading-title){font-size:calc(24px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3642 .elementor-element.elementor-element-59bd9a0 .elementor-button,.elementor-3821 .elementor-element.elementor-element-d2537c1 .elementor-button,.elementor-3821 .elementor-element.elementor-element-2a1e4d6 .elementor-button){font-size:calc(18px * var(--a11y-scale-form))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3642 .elementor-element.elementor-element-1941e35 .elementor-icon-list-item > .elementor-icon-list-text,.elementor-3642 .elementor-element.elementor-element-1941e35 .elementor-icon-list-item > a,.elementor-3642 .elementor-element.elementor-element-cfc627f .elementor-icon-list-item > .elementor-icon-list-text,.elementor-3642 .elementor-element.elementor-element-cfc627f .elementor-icon-list-item > a,.elementor-3642 .elementor-element.elementor-element-8cbbdf1 .elementor-icon-list-item > .elementor-icon-list-text,.elementor-3642 .elementor-element.elementor-element-8cbbdf1 .elementor-icon-list-item > a){font-size:calc(18px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-7c994d1 .elementor-button){font-size:calc(23px * var(--a11y-scale-form))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-e2ca982 .elementor-heading-title,.elementor-4061 .elementor-element.elementor-element-2a1e98e .elementor-heading-title){font-size:calc(48px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-c6ffa21 .elementor-heading-title){font-size:calc(93px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-cec552c .elementor-heading-title,.elementor-3821 .elementor-element.elementor-element-508d097 .elementor-heading-title){font-size:calc(17px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-5202a20){font-size:calc(28px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-dfb2701,.elementor-3821 .elementor-element.elementor-element-a057e29){font-size:calc(22px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-a286ceb .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-cb48bef .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-5e9763e .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-26a6bd9 .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-4311d8e .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-57702e1 .elementor-image-box-title){font-size:calc(20px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-6fec20b .elementor-heading-title){font-size:calc(27px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-4271 .elementor-element.elementor-element-8bb2442,.elementor-4271 .elementor-element.elementor-element-0b64c69,.elementor-4271 .elementor-element.elementor-element-ed7ce27,.elementor-4271 .elementor-element.elementor-element-7be0df0,.elementor-4271 .elementor-element.elementor-element-1de2f23,.elementor-4271 .elementor-element.elementor-element-4ce7136,.elementor-4271 .elementor-element.elementor-element-24e4de9,.elementor-4271 .elementor-element.elementor-element-c76b3ec,.elementor-4271 .elementor-element.elementor-element-7756332,.elementor-4334 .elementor-element.elementor-element-7be0df0,.elementor-4334 .elementor-element.elementor-element-1de2f23,.elementor-4334 .elementor-element.elementor-element-7756332){font-size:calc(25px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-4271 .elementor-element.elementor-element-75c611d,.elementor-4271 .elementor-element.elementor-element-4c57c62,.elementor-4271 .elementor-element.elementor-element-60b09c4,.elementor-4334 .elementor-element.elementor-element-8bb2442,.elementor-4334 .elementor-element.elementor-element-ed7ce27,.elementor-4334 .elementor-element.elementor-element-4ce7136,.elementor-4334 .elementor-element.elementor-element-c76b3ec,.elementor-4334 .elementor-element.elementor-element-75c611d,.elementor-4334 .elementor-element.elementor-element-60b09c4,.elementor-5220 .elementor-element.elementor-element-2c69559,.elementor-5220 .elementor-element.elementor-element-2966576,.elementor-5220 .elementor-element.elementor-element-168f8f3,.elementor-5220 .elementor-element.elementor-element-b64fa3d,.elementor-5220 .elementor-element.elementor-element-a240d4a){font-size:calc(19px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-767 .elementor-element.elementor-element-46e65c6 .elementor-tab-content){font-size:calc(19px * var(--a11y-scale))!important;line-height:calc(17px * var(--a11y-scale))!important}
@media (max-width:767px) {
body[class*="pojo-a11y-resize-font-"] :is(.elementor-1479 .elementor-element.elementor-element-fd085db .elementor-heading-title,.elementor-1479 .elementor-element.elementor-element-b8c6260 .elementor-heading-title,.elementor-1479 .elementor-element.elementor-element-18feaa8 .elementor-heading-title,.elementor-1776 .elementor-element.elementor-element-fd085db .elementor-heading-title,.elementor-1776 .elementor-element.elementor-element-b8c6260 .elementor-heading-title,.elementor-1776 .elementor-element.elementor-element-18feaa8 .elementor-heading-title,.elementor-1899 .elementor-element.elementor-element-fd085db .elementor-heading-title,.elementor-1899 .elementor-element.elementor-element-b8c6260 .elementor-heading-title,.elementor-1899 .elementor-element.elementor-element-18feaa8 .elementor-heading-title,.elementor-37 .elementor-element.elementor-element-fd085db .elementor-heading-title,.elementor-37 .elementor-element.elementor-element-b8c6260 .elementor-heading-title,.elementor-37 .elementor-element.elementor-element-18feaa8 .elementor-heading-title,.elementor-3821 .elementor-element.elementor-element-7256377 .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-70c94f9 .elementor-image-box-title,.elementor-4960 .elementor-element.elementor-element-fd085db .elementor-heading-title,.elementor-4960 .elementor-element.elementor-element-b8c6260 .elementor-heading-title,.elementor-4960 .elementor-element.elementor-element-18feaa8 .elementor-heading-title,.elementor-4968 .elementor-element.elementor-element-fd085db .elementor-heading-title,.elementor-4968 .elementor-element.elementor-element-b8c6260 .elementor-heading-title,.elementor-4968 .elementor-element.elementor-element-18feaa8 .elementor-heading-title,.elementor-4974 .elementor-element.elementor-element-fd085db .elementor-heading-title,.elementor-4974 .elementor-element.elementor-element-b8c6260 .elementor-heading-title,.elementor-4974 .elementor-element.elementor-element-18feaa8 .elementor-heading-title){font-size:calc(20px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-1479 .elementor-element.elementor-element-ebc1a69 .elementor-heading-title,.elementor-1776 .elementor-element.elementor-element-ebc1a69 .elementor-heading-title,.elementor-1899 .elementor-element.elementor-element-ebc1a69 .elementor-heading-title,.elementor-37 .elementor-element.elementor-element-ebc1a69 .elementor-heading-title,.elementor-4960 .elementor-element.elementor-element-ebc1a69 .elementor-heading-title,.elementor-4968 .elementor-element.elementor-element-ebc1a69 .elementor-heading-title,.elementor-4974 .elementor-element.elementor-element-ebc1a69 .elementor-heading-title){font-size:calc(19px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-1670 .elementor-element.elementor-element-e650306 .elementor-heading-title){font-size:calc(26px * var(--a11y-scale))!important;line-height:calc(36px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-1670 .elementor-element.elementor-element-7b83d83 .elementor-heading-title){font-size:calc(24px * var(--a11y-scale))!important;line-height:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-31 .elementor-element.elementor-element-ea32004 .elementor-heading-title){font-size:calc(22px * var(--a11y-scale))!important;line-height:calc(30px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-31 .elementor-element.elementor-element-98a3507 .elementor-heading-title,.elementor-4271 .elementor-element.elementor-element-8bb2442,.elementor-4271 .elementor-element.elementor-element-0b64c69,.elementor-4271 .elementor-element.elementor-element-ed7ce27,.elementor-4271 .elementor-element.elementor-element-7be0df0,.elementor-4271 .elementor-element.elementor-element-1de2f23,.elementor-4271 .elementor-element.elementor-element-4ce7136,.elementor-4271 .elementor-element.elementor-element-24e4de9,.elementor-4271 .elementor-element.elementor-element-c76b3ec,.elementor-4271 .elementor-element.elementor-element-75c611d,.elementor-4271 .elementor-element.elementor-element-4c57c62,.elementor-4271 .elementor-element.elementor-element-7756332,.elementor-4271 .elementor-element.elementor-element-60b09c4,.elementor-4334 .elementor-element.elementor-element-8bb2442,.elementor-4334 .elementor-element.elementor-element-ed7ce27,.elementor-4334 .elementor-element.elementor-element-7be0df0,.elementor-4334 .elementor-element.elementor-element-1de2f23,.elementor-4334 .elementor-element.elementor-element-4ce7136,.elementor-4334 .elementor-element.elementor-element-c76b3ec,.elementor-4334 .elementor-element.elementor-element-75c611d,.elementor-4334 .elementor-element.elementor-element-7756332,.elementor-4334 .elementor-element.elementor-element-60b09c4,.elementor-5220 .elementor-element.elementor-element-2c69559,.elementor-5220 .elementor-element.elementor-element-2966576,.elementor-5220 .elementor-element.elementor-element-168f8f3,.elementor-5220 .elementor-element.elementor-element-b64fa3d,.elementor-5220 .elementor-element.elementor-element-a240d4a){font-size:calc(18px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-7c994d1 .elementor-button){font-size:calc(15px * var(--a11y-scale-form))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-a057e29){font-size:calc(15px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-e2ca982 .elementor-heading-title){font-size:calc(37px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-c6ffa21 .elementor-heading-title){font-size:calc(70px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-5202a20,.elementor-3821 .elementor-element.elementor-element-b78475f,.elementor-3821 .elementor-element.elementor-element-b4c17cb){font-size:calc(17px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-dfb2701,.elementor-3821 .elementor-element.elementor-element-5351027){font-size:calc(16px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-a286ceb .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-cb48bef .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-5e9763e .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-26a6bd9 .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-4311d8e .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-57702e1 .elementor-image-box-title){font-size:calc(14px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-6fec20b .elementor-heading-title){font-size:calc(20px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-7256377 .elementor-image-box-description,.elementor-3821 .elementor-element.elementor-element-70c94f9 .elementor-image-box-description){font-size:calc(13px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-4061 .elementor-element.elementor-element-2a1e98e .elementor-heading-title){font-size:calc(33px * var(--a11y-scale))!important}
}
@media (max-width:1024px) {
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-e2ca982 .elementor-heading-title){font-size:calc(36px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-c6ffa21 .elementor-heading-title){font-size:calc(70px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-dfb2701){font-size:calc(19px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] :is(.elementor-3821 .elementor-element.elementor-element-a286ceb .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-cb48bef .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-5e9763e .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-26a6bd9 .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-4311d8e .elementor-image-box-title,.elementor-3821 .elementor-element.elementor-element-57702e1 .elementor-image-box-title){font-size:calc(15px * var(--a11y-scale))!important}
}

}

@layer a11y-strong {
/* ==========================================================================
   SECTION 5s - the sizes the site marked `!important`. They sit in the
   highest layer so they keep beating Elementor's per-widget typography,
   which is what happens on the live site today.
   ========================================================================== */
body[class*="pojo-a11y-resize-font-"] .tw_sec .elementor-image-box-description{font-size:calc(26px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .teammanage .elementor-image-box-description{font-size:calc(26px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .tw_sec .elementor-image-box-title{font-size:calc(25px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .teammanage .elementor-image-box-title{font-size:calc(25px * var(--a11y-scale))!important}
body[class*="pojo-a11y-resize-font-"] .skip-link{font-size:calc(20px * var(--a11y-scale))!important}
@media (max-width:1023px){
body[class*="pojo-a11y-resize-font-"] .common-head .elementor-heading-title{font-size:calc(48px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"].en_US .common-head .elementor-heading-title{font-size:calc(50px * var(--a11y-scale-lg))!important;line-height:calc(68px * var(--a11y-scale-lg))!important}
}
@media (min-width:1024px) and (max-width:1199px){
body[class*="pojo-a11y-resize-font-"] .common-head .elementor-heading-title{font-size:calc(40px * var(--a11y-scale-lg))!important}
body[class*="pojo-a11y-resize-font-"].en_US .common-head .elementor-heading-title{font-size:calc(39px * var(--a11y-scale))!important}
}
@media (min-width:1200px) and (max-width:1919px){
body[class*="pojo-a11y-resize-font-"] .common-head .elementor-heading-title{font-size:calc(48px * var(--a11y-scale-lg))!important}
}
@media (min-width:1200px) and (max-width:1365px){
body[class*="pojo-a11y-resize-font-"].en_US .common-head .elementor-heading-title{font-size:calc(42px * var(--a11y-scale-lg))!important}
}
@media (min-width:1366px){
body[class*="pojo-a11y-resize-font-"].en_US .common-head .elementor-heading-title{font-size:calc(50px * var(--a11y-scale-lg))!important;line-height:calc(68px * var(--a11y-scale-lg))!important}
}
@media (min-width:1920px){
body[class*="pojo-a11y-resize-font-"] .common-head .elementor-heading-title{font-size:calc(52px * var(--a11y-scale-lg))!important}
}


/* --------------------------------------------------------------------------
   Fixed line-heights that sit next to the sizes above and would clip the
   text once it grows. `line-height:40px !important` on a 52px–66px display
   heading is already tight; at step 200 it overlapped the line beneath.
   -------------------------------------------------------------------------- */
@media only screen and (min-width:1920px){
  body[class*="pojo-a11y-resize-font-"] .center-projectitle .font-66 .elementor-heading-title,
  body[class*="pojo-a11y-resize-font-"] .font-66 .elementor-heading-title,
  body[class*="pojo-a11y-resize-font-"] .common-head .elementor-heading-title{line-height:calc(40px * var(--a11y-scale-lg))!important}
}
/* accessibility.php pins the submit button to 25px inside `.contact_1`,
   which is what actually renders on the contact pages. */
body[class*="pojo-a11y-resize-font-"] .contact_1 .contact_left input.submit_class,
body[class*="pojo-a11y-resize-font-"] .contact_1 input[type="submit"]{font-size:calc(25px * var(--a11y-scale-form))!important}


/* ==========================================================================
   SECTION 6 â€” contrast modes (high contrast / negative contrast / light
   background)
   The plugin paints every element with the `background` SHORTHAND, which
   also resets `background-image` to none, and its high-contrast block adds
   an explicit `background-image:none !important`. That is why the slider
   arrows, the project tiles and every decorative icon disappear the moment
   a contrast mode is switched on, and why the slider dots end up black on
   black (or white on white).

   Its selectors score (1,1,1) because of `:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link)`, so
   they cannot be beaten on specificity without ID hacks â€” the cascade
   layer does it instead.

   Everything below is scoped to a content root, so #pojo-a11y-toolbar and
   the wp-accessibility .a11y-toolbar are never reached.
   ========================================================================== */

/* --- 6a. every image gets a readable backdrop ---------------------------- */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.widget-area,.sticky-social-menu,footer,.comments-area,.post-navigation,.elementor,.privacy-wrapper,.cky-consent-container,.cky-modal,.cc-root,.cc-banner):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(img,picture,video,canvas,iframe,object,embed){
  background:#fff!important;background-color:#fff!important;
  filter:none!important;-webkit-filter:none!important;
  opacity:1!important;visibility:visible!important;mix-blend-mode:normal!important;
}
body.pojo-a11y-light-background :where(.site,.site-content,.widget-area,.sticky-social-menu,footer,.comments-area,.post-navigation,.elementor,.privacy-wrapper,.cky-consent-container,.cky-modal,.cc-root,.cc-banner):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(img,picture,video,canvas,iframe,object,embed){
  background:#000!important;background-color:#000!important;
  filter:none!important;-webkit-filter:none!important;
  opacity:1!important;visibility:visible!important;mix-blend-mode:normal!important;
}

/* --- 6a2. the content ground, stated outright -----------------------------
   Reported repeatedly: whole sections rendering white with dark text in high
   and negative contrast, on the About page and "many other pages". It does
   not reproduce logged out - a sweep of every element >=80x12 on
   /מי-אנחנו/ in negative contrast found zero elements with a light
   background and zero with dark text, and every `.elementor-top-section`
   computes #000. The screenshots that show it have the WordPress admin bar
   in them, i.e. they are logged in, and logged-in requests bypass the
   LiteSpeed optimiser and are served a different stylesheet build. Whatever
   that build does differently, the plugin's own contrast rules are clearly
   not reaching the Elementor structure there.

   So stop depending on them. The rules below state the intended result
   outright instead of inheriting it: the structural wrappers get the mode's
   ground, and the block-level copy inside them gets its ink. Everything a
   contrast mode is supposed to leave alone is left alone -

     - `span` and `strong` keep the yellow the plugin gives them (they are
       not in the ink list), as do links,
     - anything carrying an inline background-image is excluded, so the
       photo tiles and their plates in 6b are untouched,
     - `background-color` does not hide a `background-image`, so the
       restored decorations further down still paint over this.

   Verified byte-identical - same section colours, same text colours, same
   named components - with and without these rules, in BOTH modes, on
   /מי-אנחנו/, /צרו-קשר/ (gold form, submit button) and /בנייה-ירוקה/
   (green cards, players, .h-1088 photo). It changes nothing where the mode
   already works and forces the right answer where it does not.
   ========================================================================== */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.elementor-top-section,.elementor-section,.elementor-container,.elementor-column,.elementor-widget-wrap,.entry-content,.site-main,.content-area,article):not([style*="background-image"]){
  background-color:#000!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.elementor-top-section,.elementor-section) :is(h1,h2,h3,h4,h5,h6,p,li,td,th,blockquote,figcaption){
  color:#fff!important;
}

/* --- 6b. background-image tiles (project cards, banner slides, team) -----
   410 elements across 59 URLs carry the photo in an inline
   `style="background-image:url(...)"`. An inline declaration is a NORMAL
   declaration, so the plugin's `!important` shorthand wins and blanks it,
   and CSS cannot read the URL back out of a style attribute to restore it.

   So the markup hands it over: every template that prints one of these
   tiles also prints `--a11y-bg: url(...)` in the same style attribute â€”
   functions.php (all three project loops), custom-template/banner.php,
   custom-template/team_banner.php, and single-projectdetails.php (both
   team_details_banner loops). A custom property renders nothing on its
   own, so the page with nothing selected is unchanged; the rule below is
   what turns it back into a picture, and only inside a contrast mode.

   New imagery needs no maintenance here. Anything that somehow lacks the
   property falls back to `none` â€” exactly today's behaviour. */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) [style*="background-image"]{
  background-image:var(--a11y-bg,none)!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
}
/* The plate behind the photo. It is only ever SEEN when the photo is not
   painting - once the image is there it covers the plate completely - so its
   colour is purely the failure state, and it must be the mode's own ground.
   It used to be the opposite (#fff in the dark modes), which turned any tile
   whose photo had not painted into a white hole in a black page. That is the
   "section goes white" report: found in the wild on /פרויקטים/ as
   `DIV.project-image.norepeat`, 500x330, `background-color: rgb(255,255,255)`,
   with these two rules named as the source. Every tile on that page does
   carry `--a11y-bg` and resolves it correctly when served logged-out, so the
   photo is dropping out for some other reason - lazy loading, a slow decode,
   a 404 on one file. Whatever the reason, a black block that matches the page
   is the right way to fail; a white one is not. Where the photo does paint,
   this changes nothing, because the plate is behind it. */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) [style*="background-image"]{background-color:#000!important;}
body.pojo-a11y-light-background :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) [style*="background-image"]{background-color:#fff!important;}

/* The two plates above assume the photo comes back. A tile whose markup was
   never given `--a11y-bg` resolves the image to `none`, and then the plate is
   all that is left: in high/negative contrast a bare WHITE block, with the
   mode's own black-on-white body copy on top of it if the tile carries text.
   That is the "section goes white with black text" failure. Give those the
   mode's real colours instead - black ground, white ink - so a tile that
   cannot show its picture at least matches everything around it.

   Every inline background-image on the six templates checked (home,
   about, projects, green, contact, project detail - 53 elements) does carry
   `--a11y-bg`, so this changes nothing today. It exists so that new imagery
   added without the property degrades to a readable block rather than a
   white hole. The extra attribute selector out-ranks the plate rules. */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) [style*="background-image"]:not([style*="--a11y-bg"]){
  background-color:#000!important;
  color:#fff!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) [style*="background-image"]:not([style*="--a11y-bg"]) :is(h1,h2,h3,h4,h5,h6,p,li,span,strong,em,a,div){
  color:#fff!important;
}

/* the banner/team slides carry text on top of the photo â€” the plugin strips
   text-shadow, so put a readable one back once the photo is visible again */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.team-flex,.banner-item,.banner_description) :is(h1,h2,h3,p,span,strong,a){
  text-shadow:0 0 6px #000,0 0 12px #000!important;
}
body.pojo-a11y-light-background :where(.site,.site-content,.elementor):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.team-flex,.banner-item,.banner_description) :is(h1,h2,h3,p,span,strong,a){
  text-shadow:0 0 6px #fff,0 0 12px #fff!important;
}

/* --- 6c. CSS background images: icons, arrows and watermarks -------------
   Two things have to be put back, not one.

   (1) THE WHOLE BACKGROUND, NOT JUST THE IMAGE. The plugin paints with the
   `background` SHORTHAND, which also resets background-repeat to `repeat`,
   background-position to `0% 0%` and background-size to `auto`. Restoring
   only the URL made every icon and watermark tile across its box from the
   top-left corner. Measured on `.project-title h2`: `no-repeat / 16px 50%`
   at rest, `repeat / 0% 0%` in all three modes. Each rule below therefore
   restores the full longhand set exactly as commonstyle.css declares it.

   (2) INK DIRECTION. A single backdrop colour cannot serve all of these â€”
   the sprites are not one colour. Sampled from the PNGs on canvas (average
   of the non-transparent pixels):
       white          prevarrow, nextarrow, white-y
       near-black     n-character, n-character1, n-character2 (38,36,36)
       light grey     project-details1 (199)
       colour         green-* (green), style-design1 / down-arrow1 (gold)
       two-tone       home-img11 - white disc, dark chevron
   On the black page the near-black ones disappear; on the white page the
   white ones do. Correcting only the offending group keeps every icon
   legible and needs no coloured plate behind it â€” which is what made the
   slider arrows read as blank white circles: a white arrow on a white
   disc. An average is not enough to classify a sprite: home-img11 averages
   237 yet needs no correction in either direction, because whichever way the
   page goes one of its two tones stays visible.

   The correction itself is a `filter` only where the sprite is carried by a
   PSEUDO-ELEMENT. Where a real element carries it, a recoloured copy of the
   artwork is used instead, because a filter would repaint the element's
   content along with its background.

   `button.play-toggle` is deliberately absent: its round-arrow.png returns
   404 on the server, so there is nothing to restore.
   -------------------------------------------------------------------------- */

/* --a11y-img-bg is the ink colour the current mode needs for borders and
   for the few plates the theme itself asks for. */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link){--a11y-img-bg:#fff;}
body.pojo-a11y-light-background :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link){--a11y-img-bg:#000;}

/* Watermarks and flourishes.
   `.n-character` and `.home_section2` are ELEMENTS, not pseudo-elements - they
   are whole Elementor sections with the page's copy inside them. The ink
   correction at the end of this section used to include them, and `filter`
   applies to the element AND its entire subtree, so it repainted the black
   ground white and the white copy black. That is the "section shows white
   instead of black in high / negative contrast" report: on /מי-אנחנו/ BOTH
   top sections carry `.n-character` (the intro and the management block), and
   the front page's `.home_section2` and the green building page's
   `.green.n-character` had the same thing.

   So the sprite carries the colour instead of the element carrying a filter:
   `-white` copies of the two near-black PNGs, generated by inverting their
   palettes, are used in the two dark modes. The light-background mode keeps
   the originals, which are already dark on a light page, and `.green.n-character`
   keeps green-n.png in every mode - it was being inverted to magenta before.

   The theme hides both watermarks below 1024px and enlarges them at 1920px.
   Restoring them with `!important` overrode that; it did not show while the
   sprite was black on a black page, but it does now, so both breakpoints are
   mirrored below. */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .n-character{
  background-image:url(../custom/images/n-character.png)!important;background-repeat:no-repeat!important;background-position:center right!important;background-size:90px!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .n-character{
  background-image:url(../custom/images/n-character-white.png)!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .green.n-character{
  background-image:url(../custom/images/green-n.png)!important;background-position:right 72px!important;
}
@media (min-width:1280px) and (max-width:1365px){
  body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .green.n-character{background-position:right 94px!important;}
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .home_section2{
  background-image:url(../custom/images/n-character1.png)!important;background-repeat:no-repeat!important;background-position:top left!important;background-size:180px!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .home_section2{
  background-image:url(../custom/images/n-character1-white.png)!important;
}
/* the theme's own breakpoints for these two, restated so `!important` does not
   override them: hidden below 1024px, larger from 1920px, and the About page's
   right-hand watermark drops out of the 1024-1199px band in Hebrew and shrinks
   in English (`.about-n::after` carries the left-hand one there) */
@media (max-width:1023px){
  body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .n-character,
  body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .home_section2{background-image:none!important;}
}
@media (min-width:1920px){
  body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .n-character{background-size:164px!important;}
  body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .home_section2{background-size:280px!important;}
}
@media (min-width:1024px) and (max-width:1199px){
  body.he_IL:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .about-n.n-character{background-image:none!important;}
  body.en_US:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .about-n.n-character{background-size:60px!important;}
}
/* the English build switches this watermark off entirely - keep it off */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .about-n::after{
  background-image:url(../custom/images/n-character1.png)!important;background-repeat:no-repeat!important;background-position:center right!important;background-size:97px!important;
}
body.en_US:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .about-n::after{background-image:none!important;}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .contact_form_blog:before{
  background-image:url(../custom/images/n-character2.png)!important;background-repeat:no-repeat!important;background-position:bottom right!important;background-size:contain!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .team_list_blog1:after{
  background-image:url(../custom/images/style-design1.png)!important;background-repeat:no-repeat!important;background-position:top left!important;background-size:contain!important;
}
/* ...except on the About page (page-id 31), where the decoration reads as a
   pale block against the mode's own background rather than as a corner
   flourish. Requested removed there only; the rule above still restores it
   everywhere else `.team_list_blog1` appears. Add the English About page's
   body class here too if the same is wanted there. */
body.page-id-31:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .team_list_blog1:after{
  background-image:none!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .single_project02 .max-1500:before{
  background-image:url(../custom/images/project-details1.png)!important;background-repeat:no-repeat!important;background-position:center left!important;background-size:contain!important;
}
@media (min-width:768px){
  body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .h-1088::before{
    background-image:url(../custom/images/white-y.png)!important;background-repeat:no-repeat!important;background-size:contain!important;background-position:0% 0%!important;
  }
}
/* The `.h-1088` section's own photo. Unlike the tiles in 6b this one is not
   inline - Elementor writes it into its per-page CSS file, so there is no
   style attribute to hang `--a11y-bg` off and nothing restores it. It is the
   ONLY casualty of that kind: a sweep of every element >=250x120 that has a
   background-image with no mode selected, then re-read in negative contrast,
   found 1 of 10 lost on /בנייה-ירוקה/, 1 of 8 on /en/green-building/ and
   0 of 24 on the front page.

   Both language versions are the same Elementor section id, so one rule
   covers them. The values are the section's own, verified identical to the
   no-mode rendering (`50% 0%`, `100%`). If the section is ever rebuilt in
   Elementor the id changes and this stops matching - the photo would simply
   go back to disappearing in the three modes, nothing else breaks. */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .elementor-element-89879d9.h-1088{
  background-image:url(https://altnoy.com/wp-content/uploads/2022/08/Elchanan_14_view_day.png)!important;
  background-position:top center!important;
  background-repeat:no-repeat!important;
  background-size:100% auto!important;
}
@media screen and (max-width:767px){
  body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .green-feature-lists::before{
    background-image:url(../custom/images/white-y.png)!important;background-repeat:no-repeat!important;background-size:contain!important;background-position:0% 0%!important;
  }
}

/* Functional icons */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .project-title h2{
  background-image:url(../custom/images/home-img11.png)!important;background-repeat:no-repeat!important;background-position:left 16px center!important;background-size:auto!important;
}
body.en_US:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .project-title h2{background-position:right 16px center!important;}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .green .project-title h2{
  background-image:url(../custom/images/green-arrow.png)!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .green-star{
  background-image:url(../custom/images/green-star.png)!important;background-repeat:no-repeat!important;background-position:center!important;background-size:26px!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .primary-navigation .primary-menu-container > ul .menu-item.menu-item-has-children > a:before{
  background-image:url(../custom/images/down-arrow1.png)!important;background-repeat:no-repeat!important;background-position:left top!important;background-size:contain!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .green-player{
  background-image:url(../custom/images/green-audio-bg.png)!important;background-repeat:no-repeat!important;background-position:center!important;background-size:100%!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .audio-player .play-btn{
  background-image:url(../custom/images/green-audio-play.png)!important;background-repeat:no-repeat!important;background-position:center!important;background-size:contain!important;background-color:#82a850!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .audio-player .play-btn.pause{
  background-image:url(../custom/images/green-audio-pause.png)!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .green-feature-lists .green-feature-list a{
  background-image:url(../custom/images/green-plus.png)!important;background-repeat:no-repeat!important;background-position:center!important;background-size:40px!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .green-feature-lists .green-feature-list a.green-minus{
  background-image:url(../custom/images/green-minus.png)!important;
}

/* Ink correction. On the black page only the near-black sprites need it;
   on the white page only the white / near-white ones do.

   Only PSEUDO-ELEMENTS are filtered here. A filter on a real element also
   repaints everything inside it, so a sprite carried by an element that holds
   content gets recoloured artwork instead - see the two `-white` watermarks
   above.

   `.project-title h2` is gone from the light-background list for that reason
   and one more: home-img11.png is not the white sprite its 237 average
   suggests. It is a 40px WHITE DISC with a thin dark chevron on it (1128 light
   pixels against 86 dark ones), so on a white page the disc disappears and the
   chevron reads - which is exactly how the card looks with no mode selected.
   Inverting it produced a black disc with a white chevron AND flipped the
   card's own title text, neither of which the page ever shows.

   Written as separate selectors on purpose: `:is()` does not accept
   pseudo-elements, and it is forgiving, so ::after / :before arguments
   would be dropped silently rather than erroring. */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .about-n::after,
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .contact_form_blog:before{
  filter:invert(1)!important;
}
body.pojo-a11y-light-background :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .h-1088::before,
body.pojo-a11y-light-background :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .green-feature-lists::before,
body.pojo-a11y-light-background :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .single_project02 .max-1500:before{
  filter:invert(1)!important;
}

/* --- 6d. slider arrows and dots ------------------------------------------
   The arrows are 36x36 boxes whose only content is a WHITE PNG, so they are
   already correct on the black page â€” they just need their background put
   back (`no-repeat`, centred, native size) and no plate behind them. On the
   white page the white arrow is inverted to black instead.

   `.owl-dots` is an absolutely positioned strip over the photo. The plugin
   paints it opaque, which is the black band across the slider; it has to go
   back to transparent, along with `.owl-nav` and the stage wrappers, or the
   restored photos sit behind a solid rectangle.

   The dots themselves are a 14px circle: black by default, white when
   active â€” i.e. invisible on the black page AND invisible on the white one.
   They become a ring in the page's ink colour, filled yellow (or black)
   when active. */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.owl-dots,.owl-nav,.owl-stage,.owl-stage-outer,.owl-item,.swiper-pagination){
  background:transparent!important;background-color:transparent!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.owl-prev,.owl-next){
  background-color:transparent!important;
  background-repeat:no-repeat!important;
  background-position:center center!important;
  background-size:auto!important;
  border:0!important;
  border-radius:0!important;
  opacity:1!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .owl-prev{background-image:url(../custom/images/prevarrow.png)!important}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .owl-next{background-image:url(../custom/images/nextarrow.png)!important}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .owl-carousel.owl-rtl .owl-prev{background-image:url(../custom/images/nextarrow.png)!important}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .owl-carousel.owl-rtl .owl-next{background-image:url(../custom/images/prevarrow.png)!important}
/* white arrow on a white page - flip it */
body.pojo-a11y-light-background :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.owl-prev,.owl-next){filter:invert(1)!important;}

body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.owl-dot,.swiper-pagination-bullet){
  background:transparent!important;background-color:transparent!important;
  border:2px solid #fff!important;box-sizing:border-box!important;opacity:1!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.owl-dot.active,.swiper-pagination-bullet-active){
  background:#ffff00!important;background-color:#ffff00!important;border-color:#ffff00!important;
}
body.pojo-a11y-light-background :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.owl-dot,.swiper-pagination-bullet){
  background:transparent!important;background-color:transparent!important;
  border:2px solid #000!important;box-sizing:border-box!important;opacity:1!important;
}
body.pojo-a11y-light-background :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.owl-dot.active,.swiper-pagination-bullet-active){
  background:#000!important;background-color:#000!important;border-color:#000!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.elementor-swiper-button,.swiper-button-next,.swiper-button-prev){
  color:var(--a11y-img-bg,#fff)!important;opacity:1!important;
}

/* --- 6e. buttons ---------------------------------------------------------
   The plugin borders <button> and <input> in high/negative contrast but
   leaves anchor-based CTAs (Elementor buttons, .global-btn) and the whole
   light-background mode with no border at all â€” a white button on a white
   page. */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.widget-area,.elementor,footer,.cky-consent-container,.cky-modal):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(button,input[type="submit"],input[type="button"],input[type="reset"],[role="button"],.elementor-button,a.elementor-button-link,.submit_class,.wpcf7-submit,.global-btn,.btn,a.button,.cky-btn,.nav-previous a,.nav-next a,.next-button a,.post-navigation a,.read-less,.elementor-cta__button,.elementor-toc__header-button){
  border:2px solid #fff!important;
}
body.pojo-a11y-light-background :where(.site,.site-content,.widget-area,.elementor,footer,.cky-consent-container,.cky-modal):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(button,input[type="submit"],input[type="button"],input[type="reset"],[role="button"],.elementor-button,a.elementor-button-link,.submit_class,.wpcf7-submit,.global-btn,.btn,a.button,.cky-btn,.nav-previous a,.nav-next a,.next-button a,.post-navigation a,.read-less,.elementor-cta__button,.elementor-toc__header-button){
  border:2px solid #000!important;
}
/* ...except the icon controls handled above, which keep their own shape */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.owl-prev,.owl-next,.owl-dot,.swiper-button-next,.swiper-button-prev,.elementor-swiper-button,.play-toggle,.play-btn,.privacy-close-btn,.dialog-close-button,.sub-menu-toggle,.cross-open-sty,.cross-close-sty){
  border-color:var(--a11y-img-bg,#fff)!important;
}

/* --- 6e2. video posters ---------------------------------------------------
   `.video__play-button` is not a small play chip - it is the click target for
   the whole player, so it is exactly as big as the video (measured 1385x590
   on /בנייה-ירוקה/). The button rule in 6e above gives every `button` a
   background, which turns that overlay into a solid plate painted straight
   over the poster frame:

     negative-contrast   button background #000  -> video completely hidden
     light-background    button background #fff  -> video completely hidden
     high-contrast       transparent, but the IFRAME was painted #fff

   The Vimeo embeds are all `transparent=1`, so whatever sits behind the
   player shows through until the poster frame paints. White is the wrong
   ground for that in two of the three modes; black is right in all three and
   matches the letterbox the player uses anyway.

   Same markup on every video the theme prints - green_banner_video(),
   project_banner_video(), tel_aviv_project_banner_video(),
   custom-template/banner.php and custom-template/projecthold.php - and the
   Hebrew and English pages share those shortcodes, so this covers both.
   The 2px border from 6e is deliberately left in place: it is the only thing
   marking the player as a control once its background is transparent. */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.video__play-button,.play-toggle,.green-play,.video-background-controls){
  background:transparent!important;
  background-color:transparent!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.video-area iframe,.vimeo-wrapper iframe,.youtube_iframe iframe,.elementor-video-iframe,iframe[src*="vimeo"],iframe[src*="youtube"]){
  background-color:#000!important;
  opacity:1!important;
  filter:none!important;
}

/* --- 6f. form fields and checkboxes -------------------------------------- */
body.pojo-a11y-light-background :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="search"],input[type="number"],input[type="password"],select,textarea){
  border:1px solid #000!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(input[type="checkbox"],input[type="radio"]){
  -webkit-appearance:none!important;appearance:none!important;
  background:transparent!important;background-color:transparent!important;
  border:2px solid var(--a11y-img-bg,#fff)!important;
  box-sizing:border-box!important;
  display:inline-block!important;
  vertical-align:middle!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) input[type="radio"]{border-radius:50%!important;}
/* Checked state: FILL the box, and recolour the tick THE THEME ALREADY
   DRAWS. Twenty Twenty-One renders its own checkmark as
   `input[type="checkbox"]::after` - a 7x13px box with a 3px right and
   bottom border rotated 45 degrees, `opacity:0` normally and `opacity:1`
   when checked. An earlier version of this block painted a SECOND tick as
   a background SVG, which is why two ticks showed in one box. There is one
   tick now: the theme's own, coloured against the fill.

   Only `border-color` is set for the checkbox - that pseudo-element is a
   rotated rectangle whose visible part IS the border, so giving it a
   background would paint a solid blob instead of a check. The radio marker
   is a filled dot, so it takes background-color too. */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(input[type="checkbox"],input[type="radio"]):checked{
  background-color:#fff!important;
  border-color:#fff!important;
  background-image:none!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) input[type="checkbox"]:checked::after{
  border-color:#000!important; opacity:1!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) input[type="radio"]:checked::after{
  border-color:#000!important; background-color:#000!important; opacity:1!important;
}
body.pojo-a11y-light-background :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(input[type="checkbox"],input[type="radio"]):checked{
  background-color:#000!important;
  border-color:#000!important;
  background-image:none!important;
}
body.pojo-a11y-light-background :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) input[type="checkbox"]:checked::after{
  border-color:#fff!important; opacity:1!important;
}
body.pojo-a11y-light-background :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) input[type="radio"]:checked::after{
  border-color:#fff!important; background-color:#fff!important; opacity:1!important;
}

/* the validation tip and the CF7 response are forced to #000 by
   accessibility.php, which is unreadable on the black high-contrast page */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast) :where(.site,.site-content,.elementor):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.wpcf7-not-valid-tip,.wpcf7-response-output){color:#ffff00!important;}
body.pojo-a11y-light-background :where(.site,.site-content,.elementor):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.wpcf7-not-valid-tip,.wpcf7-response-output){color:#000!important;}


/* ==========================================================================
   SECTION 6e - the header chrome: brand logo, hamburger icon, menu close
   button and the menu phone number.

   All four vanish in the contrast modes, each for its own reason, and all
   four are the first thing a user meets on a page - on mobile the burger
   IS the navigation.

   (1) THE BRAND LOGO IS WHITE-AND-GOLD INK ON TRANSPARENCY. Read straight
   out of Altnoyland-Logo.gif's global colour table: 32 entries, and every
   one of them is either the brand gold (229,178,45) or a near-white
   (225..255). There is no dark ink in the file at all - at rest the mark
   only reads because it sits on the dark banner.
   Section 6a hands every image the backdrop OPPOSITE the page, which is
   right for the dark-ink photos and tiles it was written for, and exactly
   wrong here: on the black high-contrast/negative page the logo got a
   WHITE plate, so white ink landed on white and the header showed a blank
   pale slab (measured on /en/home/ at 375px: img background
   rgb(255,255,255) inside a rgb(0,0,0) header). The plate has to follow
   the ink, not the page, so it is pinned to black in all three modes -
   seamless on the two dark pages, a deliberate dark badge on the light
   one. .right-arrow img (close_menu.png) is in the same list: sampled on
   canvas it is 216 pure-white pixels and 360 transparent ones, i.e. the
   same white-ink-on-nothing case, and it is the only way out of the
   open mobile menu.

   Anything with its own opaque background - logo_a.jpg, the yarok-white
   GIF on pages 3052/3316 - is unaffected by a plate it completely covers,
   so listing them costs nothing and protects them if they are ever
   re-exported with transparency.

   (2) THE BURGER BARS TAKE THE PAGE COLOUR. .toggle-hamburga span is a
   35x2 block whose only paint is `background:var(--black)` (and
   var(--sitecolor) on .two), none of it `!important`, so the plugin's
   blanket `background:#000/#fff !important` simply repaints all four bars
   in the page's own colour: black bars on the black page, white bars on
   the white one. Measured in all three modes - four spans, every one of
   them the same rgb() as the header behind it. They are put on
   --a11y-img-bg, which Section 6c already defines as the current mode's
   INK colour (#fff on the two dark pages, #000 on the light one), so the
   icon is legible in each without a second set of rules. The `.open`
   state's un-layered `background:white !important` is beaten here because
   an `!important` inside a layer outranks an un-layered one. Only
   `background` is touched, never `opacity`: Section 8 deliberately leaves
   opacity transitionable, the open/closed fade on the outer two bars is a
   never-settling opacity transition, and a running transition outranks
   `!important` - an opacity declaration here would simply be ignored while
   putting the X animation at risk. Verified: with a mode on and `.open`
   forced, both outer spans still report a live `opacity` transition.

   (3) THE MENU PHONE NUMBER IS PINNED BLACK BY THE MOBILE STYLESHEET.
   commonstyle.css's max-width:767px block ends with
   `.menu-phone > a{color:#000 !important}` (and `#fff !important` on
   hover). Both are un-layered, but they score (0,5,1) against the
   plugin's (1,2,0)... on specificity the plugin wins, yet it loses the
   only comparison that matters here because BOTH are `!important` and the
   site's rule is the more specific of the two - so `tel:*8829` renders
   black on the black high-contrast page and white on white when hovered
   in light-background. Same --a11y-img-bg treatment, hover included.

   Scoped to `.site` (not `.site-content`): the header is a SIBLING of
   #content.site-content, so a .site-content-only scope would never reach
   it. #pojo-a11y-toolbar is excluded exactly as everywhere else in this
   sheet.
   ========================================================================== */

/* 6e-1. brand logo + menu close button - plate follows the ink, not the page */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(.site-logo,.logo-image,.site-header-logo,.accessibility_on,.right-arrow) img{
  background:#000!important;background-color:#000!important;
  filter:none!important;-webkit-filter:none!important;
  opacity:1!important;visibility:visible!important;mix-blend-mode:normal!important;
}

/* 6e-2. hamburger icon - all four bars on the current mode's ink colour */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .toggle-hamburga span{
  background:var(--a11y-img-bg,#fff)!important;
  background-color:var(--a11y-img-bg,#fff)!important;
}

/* 6e-3. the menu phone number, which the mobile sheet pins to #000/#fff */
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .primary-navigation .primary-menu-container > ul .menu-phone > a,
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .primary-navigation .primary-menu-container > ul .menu-phone > a:hover,
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .primary-navigation .primary-menu-container > ul .menu-phone > a:focus{
  color:var(--a11y-img-bg,#fff)!important;
}


/* --- 6f. input placeholders --------------------------------------------
   The placeholders go BLACK-ON-BLACK in high contrast and negative
   contrast, but only in Chrome, Edge and Safari - in Firefox they are
   readable. That browser split is the whole clue: commonstyle.css styles
   them with the legacy WebKit alias

       .contact_left ::-webkit-input-placeholder { color: var(--black); }

   and nothing else. Blink and WebKit honour that selector, so the
   placeholder keeps its designed black while the plugin repaints the field
   itself black; Gecko does not recognise `::-webkit-input-placeholder` at
   all, drops the rule, and falls back to inheriting the input's `color` -
   which the plugin has already set to white/yellow. Same CSS, opposite
   result, and nothing about it is visible from the Firefox side.

   Measured on /en/green-building/ in Chrome: field background #000 with
   `::placeholder` computing to rgb(0,0,0) in both dark modes - a contrast
   ratio of 1:1, i.e. the label is simply not there. Light background was
   already fine (#000 on #fff) and is pinned anyway so it cannot drift.

   The placeholder takes the mode's own ink colour rather than a dimmed
   version of it: these modes exist because the user needs maximum
   separation, and a 54%-opacity grey is the opposite of that. `opacity:1`
   is for Gecko, which applies 0.54 of its own accord.

   TWO SEPARATE RULES, NOT ONE SELECTOR LIST. `::-webkit-input-placeholder`
   is a parse error in Gecko, and one invalid selector invalidates the
   ENTIRE selector list - grouping them would silently drop the fix in the
   one browser that currently still works. The prefixed rule is what
   out-ranks the site's own prefixed rule in Blink/WebKit; the standard one
   carries every other engine.
   -------------------------------------------------------------------------- */
body.pojo-a11y-high-contrast :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link){--a11y-ph:#fff;}
body.pojo-a11y-negative-contrast :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link){--a11y-ph:#ff0;}
body.pojo-a11y-light-background :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link){--a11y-ph:#000;}

body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(input,textarea)::placeholder{
  color:var(--a11y-ph,#fff)!important;
  -webkit-text-fill-color:var(--a11y-ph,#fff)!important;
  opacity:1!important;
}
body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background) :where(.site,.site-content,.widget-area,.elementor,footer):not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) :is(input,textarea)::-webkit-input-placeholder{
  color:var(--a11y-ph,#fff)!important;
  -webkit-text-fill-color:var(--a11y-ph,#fff)!important;
  opacity:1!important;
}


/* ==========================================================================
   SECTION 10 — the footer's 3-column row, once a resize step is active.

   Gated behind `body[class*="pojo-a11y-resize-font-"]`, on purpose: the
   theme's own `.footer-logo` / `.footer-menu` / `.footer-socialicon` /
   `.footer_page .primary-menu-container > ul` rules in responsive.css /
   commonstyle.css are left completely untouched, so the page looks
   identical to today with no resize step selected (RULE A at the top of
   this file). This section only takes over once the widget has scaled the
   type up.

   None of the three columns has a flex-basis normally - each sizes to its
   own content, `.footer_page .flex` only wraps (`flex-wrap:wrap`, the
   generic `.flex` rule in commonstyle.css) once the WHOLE row runs out of
   room, and the link list is a fixed `columns:2`. That is fine at the
   theme's own type size. Once the widget scales the footer links and the
   address paragraph, two things break:

     1. Flex items shrink to their min-content floor before a row is asked
        to wrap - so instead of `.footer-socialicon` dropping to its own
        line, the LINK TEXT wrapped inside its now-too-narrow column.
        Reproduced at 768-991px and above once the scaled type needed more
        room than the row had left.
     2. `.footer-socialicon`'s 5 icons (`display:inline-block`) wrap onto a
        second row the same way ordinary inline content does, the moment
        their column drops under ~242px (measured).
     3. `.new-small-banner` (the BDI / Duns100 badges under the address)
        made both worse: it is `position:absolute` with a large negative
        offset (several conflicting `left`/`right !important` declarations
        fight over the exact value - theme rules plus at least one
        external `!important` one), sized to sit in the gutter between the
        menu and social columns on a wide desktop row. Once
        `.footer-socialicon` moved - narrower, or wrapped - the badges'
        offset (still relative to `.footer-address`, which just moved with
        it) put them off-screen or on top of the menu links.

   Fix: give `.footer-logo` its natural width, give `.footer-menu` a
   guaranteed minimum (never squeezed below one non-wrapping column) built
   from `calc(<base-px> * var(--a11y-scale))`, and give `.footer-socialicon`
   a fixed 260px (>=242px, so its icon row never wraps). `.footer_page .flex`
   keeps `flex-wrap:wrap`, so when all three don't fit, `.footer-socialicon`
   - the last item - is what drops to its own line; logo+menu keep their
   row. `.footer-menu`'s guaranteed minimum is sized for TWO columns, not
   one - a first version guaranteed only one and let the link list's
   `column-width` fall back to a single column under pressure, which
   pushed the 4th-6th links ("*8829" / "Accessibilty Statement" /
   "Privacy Policy", normally their own column beside the first three)
   down below "Contact Us" instead of staying beside it. `.footer-menu`
   never shrinking below its 2-column minimum means `.footer-socialicon`
   is always the one that gives way, never the link list's own layout -
   `column-width` (not the theme's fixed `columns:2`) still keeps each
   column comfortably >= one link's safe width, it just never has reason
   to fall back below 2 now. `.new-small-banner` moves into normal flow
   (`position:relative`), exactly like the theme's own `max-width:600px`
   mobile rule already does for it.

   <base-px> is the widest single link's rendered width at 100% for that
   language, measured against the theme's real footer-link type scale
   (Section 5 above): 24px across 768-1919px, 29px at >=1920px - hence the
   two tiers below, each with its own base and a small safety margin:
   230px = "Accessibilty Statement" (measured 209.9px) / 150px =
   "מדיניות פרטיות" (measured 131.1px) for the first tier; 310px
   (measured 291.5px) / 180px (measured 158.4px) for the second.
   `.footer-menu`'s own flex-basis doubles that base (2 columns, not 1)
   and adds `+24px` for the list's column-gap on top of the usual `+48px`
   for the link's own left+right padding (`box-sizing:border-box` puts
   both inside the flex-basis) - `+72px` total.

   Verified on /he/ and /en/home/ + /en/about-us/ at 768/900/1200/1394/1920
   /2560px through every resize step (100-200): the link list always shows
   2 columns with the same 3+3 grouping as the untouched design, no link
   wraps, no icon wraps, `.footer-socialicon` drops cleanly to its own row
   only when needed, no horizontal scroll from this row, no residual
   change with no resize step selected. */
@media (min-width:768px) and (max-width:1919px){
  body[class*="pojo-a11y-resize-font-"] .footer_page .flex{
    flex-wrap:wrap!important;
    align-items:flex-start!important;
  }
  body[class*="pojo-a11y-resize-font-"] .footer-logo{
    flex:0 0 auto!important;
    max-width:none!important;
  }
  body[class*="pojo-a11y-resize-font-"] .footer-menu{
    flex:1 0 calc(300px * var(--a11y-scale) + 72px)!important;
    min-width:0!important;
    max-width:none!important;
    box-sizing:border-box!important;
    padding:0 24px!important;
  }
  body[class*="pojo-a11y-resize-font-"].en_US .footer-menu{
    flex-basis:calc(460px * var(--a11y-scale) + 72px)!important;
  }
  body[class*="pojo-a11y-resize-font-"]:not(.en_US) .footer-menu{
    flex-basis:calc(300px * var(--a11y-scale) + 72px)!important;
  }
  body[class*="pojo-a11y-resize-font-"] .footer_page .primary-menu-container > ul{
    columns:unset!important;
    column-gap:24px!important;
    column-width:calc(150px * var(--a11y-scale))!important;
  }
  body[class*="pojo-a11y-resize-font-"].en_US .footer_page .primary-menu-container > ul{
    column-width:calc(230px * var(--a11y-scale))!important;
  }
  body[class*="pojo-a11y-resize-font-"] .footer-socialicon{
    flex:0 0 260px!important;
    max-width:none!important;
  }
}
@media (min-width:1920px){
  body[class*="pojo-a11y-resize-font-"] .footer_page .flex{
    flex-wrap:wrap!important;
    align-items:flex-start!important;
  }
  body[class*="pojo-a11y-resize-font-"] .footer-logo{
    flex:0 0 auto!important;
    max-width:none!important;
  }
  body[class*="pojo-a11y-resize-font-"] .footer-menu{
    flex:1 0 calc(360px * var(--a11y-scale) + 72px)!important;
    min-width:0!important;
    max-width:none!important;
    box-sizing:border-box!important;
    padding:0 24px!important;
  }
  body[class*="pojo-a11y-resize-font-"].en_US .footer-menu{
    flex-basis:calc(620px * var(--a11y-scale) + 72px)!important;
  }
  body[class*="pojo-a11y-resize-font-"]:not(.en_US) .footer-menu{
    flex-basis:calc(360px * var(--a11y-scale) + 72px)!important;
  }
  body[class*="pojo-a11y-resize-font-"] .footer_page .primary-menu-container > ul{
    columns:unset!important;
    column-gap:24px!important;
    column-width:calc(180px * var(--a11y-scale))!important;
  }
  body[class*="pojo-a11y-resize-font-"].en_US .footer_page .primary-menu-container > ul{
    column-width:calc(310px * var(--a11y-scale))!important;
  }
  body[class*="pojo-a11y-resize-font-"] .footer-socialicon{
    flex:0 0 260px!important;
    max-width:none!important;
  }
}
@media (min-width:768px){
  /* accessibility.php adds `.en_US .footer_page .primary-menu-container > ul
     { padding-right:80px }` at >=768px. That padding is INSIDE the element
     the columns are computed from, so it silently removes 80px from the
     width available to `column-width` - enough, at some steps, to drop the
     list from 2 columns to 1 even though `.footer-menu` had been sized for
     2 (measured on /en/home/ at 900px, step 150: 672px box, 592px content,
     2 columns needed 612px). The columns' own `column-gap` provides the
     separation this padding used to, so zeroing it here keeps the
     2-column result deterministic in both languages. */
  body[class*="pojo-a11y-resize-font-"] .footer_page .primary-menu-container > ul{
    padding-left:0!important;
    padding-right:0!important;
  }

  body[class*="pojo-a11y-resize-font-"] .footer-socialicon .menu-social-icon-container ul{
    white-space:nowrap!important;
  }
  body[class*="pojo-a11y-resize-font-"] .new-small-banner,
  body[class*="pojo-a11y-resize-font-"] html[lang="en-US"] .new-small-banner,
  body[class*="pojo-a11y-resize-font-"].en_US .new-small-banner{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:0!important;
    width:100%!important;
  }
  body[class*="pojo-a11y-resize-font-"] .new-small-banner a{
    display:inline-block!important;
    margin:0 10px 10px 0!important;
  }
}

}


