/* Bikurey Hasade site: tokens, reset, layout model and widget styles.
   Per-element design values live in /css/el/<doc-id>.css (generated by scripts/styles.mjs).
   Breakpoints: mobile <= 767px, tablet 768-1024px, desktop >= 1025px. */

/* ---------- Tokens ---------- */
/* Text grey and accent green are a shade darker than the design's #707070 and #14A348, which fall short of
   WCAG AA contrast (Ron's request, accessibility audit finding #2): green #11873C gives 4.6:1 with white,
   grey #666666 gives 4.7:1 on the darker beige sections. See "Colour contrast" below for the hover colours. */
:root {
  --color-primary: #d54930;
  --color-secondary: #222222;
  --color-text: #666666;
  --color-accent: #11873c;
  --color-ba90683: #b8d232;
  --color-3c3fa38: #ebe7e1;
  --color-9fe5d07: #f4efe9;
  --font-primary-family: 'Rubik';
  --font-primary-weight: bold;
  --font-secondary-family: 'Rubik';
  --font-secondary-weight: 400;
  --font-text-family: 'Rubik';
  --font-text-weight: 400;
  --font-accent-family: 'Rubik';
  --font-accent-weight: 500;
  --widget-spacing: 20px;
}

/* ---------- Reset ---------- */
html { line-height: 1.15; -webkit-text-size-adjust: 100%; }
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #333;
  background-color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4, h5, h6 {
  margin-block: 0.5rem 1rem;
  font-family: inherit;
  font-weight: 500;
  line-height: 1.2;
  color: inherit;
}
h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.75rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.25rem; }
h6 { font-size: 1rem; }
p { margin-block: 0; }
p:not(:last-child) { margin-block-end: 0.9rem; }
a { background-color: transparent; color: #c36; text-decoration: none; }
a:hover, a:active { color: #336; }
b, strong { font-weight: bolder; }
img { border-style: none; height: auto; max-width: 100%; }
figure { margin: 0; }
ul, ol { margin-block: 0; }
button, input, select, textarea { font-family: inherit; font-size: 1rem; line-height: 1.5; margin: 0; }
html, body { overflow-x: hidden; }
.screen-only {
  position: absolute; top: -10000em; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;
}

/* Emoji images (inline, sized to the surrounding text, as WordPress renders them) */
.doc img.emoji {
  display: inline;
  width: 1em;
  height: 1em;
  max-width: none;
  margin: 0 0.07em;
  padding: 0;
  border: none;
  box-shadow: none;
  background: none;
  vertical-align: -0.1em;
}

/* ---------- Layout model: document > section > container > column > widget-wrap > widget ---------- */
.doc *, .doc *::before, .doc *::after { box-sizing: border-box; }
.doc img { border: none; border-radius: 0; box-shadow: none; height: auto; max-width: 100%; }
.doc a { text-decoration: inherit; }

.section { position: relative; }
.section > .container { display: flex; margin-inline: auto; position: relative; }
.section.section-boxed > .container { max-width: 1140px; }
.section.section-items-top > .container { align-items: flex-start; }
.section.section-items-middle > .container { align-items: center; }
.section.section-items-bottom > .container { align-items: flex-end; }
.section.section-items-stretch > .container { align-items: stretch; }
.section.section-height-min-height > .container::after { content: ''; min-height: inherit; }
.background-overlay { position: absolute; inset: 0; }
/* Background scroll effect (driven by /js/site.js) */
.motion-effects-container { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.motion-effects-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transform: translateY(var(--translateY, 0px));
  will-change: transform;
}

.column { display: flex; position: relative; min-height: 1px; }
.column-gap-default > .column > .element-populated { padding: 10px; }
.column-gap-no > .column > .element-populated { padding: 0; }
.widget-wrap { display: flex; flex-wrap: wrap; align-content: flex-start; position: relative; width: 100%; }
.widget-wrap > .element { width: 100%; }

.widget { position: relative; }
.widget:not(:last-child) { margin-block-end: var(--widget-spacing); }
.widget:not(:last-child).absolute,
.widget:not(:last-child).widget__width-auto,
.widget:not(:last-child).widget__width-initial { margin-block-end: 0; }
.widget-wrap .element.widget__width-auto,
.widget-wrap .element.widget__width-initial { max-width: 100%; }
.element.absolute { position: absolute; z-index: 1; }

@media (min-width: 768px) {
  .col-10 { width: 10%; } .col-12 { width: 12.5%; } .col-14 { width: 14.285%; } .col-16 { width: 16.666%; }
  .col-20 { width: 20%; } .col-25 { width: 25%; } .col-30 { width: 30%; } .col-33 { width: 33.333%; }
  .col-40 { width: 40%; } .col-50 { width: 50%; } .col-60 { width: 60%; } .col-66 { width: 66.666%; }
  .col-70 { width: 70%; } .col-75 { width: 75%; } .col-80 { width: 80%; } .col-83 { width: 83.333%; }
  .col-90 { width: 90%; } .col-100 { width: 100%; }
}
@media (max-width: 1024px) {
  .section > .container { flex-wrap: wrap; }
  .widget-wrap .element.widget-tablet__width-auto,
  .widget-wrap .element.widget-tablet__width-initial { max-width: 100%; }
}
@media (max-width: 767px) {
  .column { width: 100%; }
  .widget-wrap .element.widget-mobile__width-auto,
  .widget-wrap .element.widget-mobile__width-initial { max-width: 100%; }
  .reverse-mobile > .container > :nth-child(1) { order: 10; }
  .reverse-mobile > .container > :nth-child(2) { order: 9; }
  .reverse-mobile > .container > :nth-child(3) { order: 8; }
  .reverse-mobile > .container > :nth-child(4) { order: 7; }
  .reverse-mobile > .container > :nth-child(5) { order: 6; }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .reverse-tablet > .container > :nth-child(1) { order: 10; }
  .reverse-tablet > .container > :nth-child(2) { order: 9; }
  .reverse-tablet > .container > :nth-child(3) { order: 8; }
}

/* Visibility per breakpoint */
@media (min-width: 1025px) { .doc .hidden-desktop { display: none; } }
@media (min-width: 768px) and (max-width: 1024px) { .doc .hidden-tablet { display: none; } }
@media (max-width: 767px) { .doc .hidden-mobile, .doc .hidden-phone { display: none; } }

/* ---------- Alignment helpers ---------- */
.align-center { text-align: center; }
.align-left { text-align: left; }
.align-right { text-align: right; }
.align-justify .button { width: 100%; }
@media (max-width: 1024px) {
  .tablet-align-center { text-align: center; }
  .tablet-align-left { text-align: left; }
  .tablet-align-right { text-align: right; }
  .tablet-align-justify .button { width: 100%; }
}
@media (max-width: 767px) {
  .mobile-align-center { text-align: center; }
  .mobile-align-left { text-align: left; }
  .mobile-align-right { text-align: right; }
  .mobile-align-justify .button { width: 100%; }
}

/* ---------- Widgets ---------- */
.heading-title { margin: 0; padding: 0; line-height: 1; }
.heading-title a { color: inherit; font-size: inherit; line-height: inherit; }

.button {
  display: inline-block;
  line-height: 1;
  text-align: center;
  font-size: 15px;
  padding: 12px 24px;
  border-radius: 3px;
  background-color: #69727d;
  color: #fff;
  fill: #fff;
  transition: all 0.3s;
  cursor: pointer;
}
.button:hover, .button:focus, .button:visited { color: #fff; }
.button-content-wrapper { display: flex; flex-direction: row; justify-content: center; gap: 5px; }
.button-text { display: inline-block; }
.button span { text-decoration: inherit; }

.widget-image { text-align: center; }
.widget-image a { display: inline-block; }
.widget-image img { display: inline-block; vertical-align: middle; }
.widget-image .wp-caption { margin: 0; }
.widget-image-caption { display: block; margin-block: 0; font-size: 1rem; line-height: 1.4; }
.widget-image .widget-container, .widget-theme-site-logo .widget-container { line-height: 0; }
.widget-image .widget-image-caption { line-height: 1.4; }

.widget-divider { --divider-border-style: none; --divider-border-width: 1px; --divider-color: #0c0d0e; }
.widget-divider .divider { display: flex; padding-block: 15px; }
.widget-divider .divider-separator {
  display: flex;
  margin: 0;
  direction: ltr;
  border-block-start: var(--divider-border-width) var(--divider-border-style) var(--divider-color);
}

/* Image box: picture beside (desktop) or above (mobile) the text */
.image-box-wrapper .image-box-img { display: inline-block; }
.image-box-wrapper .image-box-img img { display: block; width: 100%; }
/* Scoped to the content block so it beats the generic `p:not(:last-child)` spacing rule.
   (Titles keep the heading reset's top margin, as on the live site.) */
.image-box-content .image-box-description { margin: 0; }
.position-top .image-box-wrapper { display: block; text-align: center; flex-direction: unset; }
/* "left"/"right" are physical sides: in RTL the row runs right-to-left, so the order flips.
   Picture and text both shrink to share the row (the picture's width setting is its flex basis). */
@media (min-width: 768px) {
  .position-left .image-box-wrapper,
  .position-right .image-box-wrapper { display: flex; }
  .position-left .image-box-wrapper { flex-direction: row; }
  .position-right .image-box-wrapper { flex-direction: row-reverse; }
  [dir='rtl'] .position-left .image-box-wrapper { flex-direction: row-reverse; }
  [dir='rtl'] .position-right .image-box-wrapper { flex-direction: row; }
  .position-left .image-box-content, .position-right .image-box-content { width: 100%; }
  .vertical-align-top .image-box-wrapper { align-items: flex-start; }
  .vertical-align-middle .image-box-wrapper { align-items: center; }
  .vertical-align-bottom .image-box-wrapper { align-items: flex-end; }
}
@media (max-width: 767px) {
  .image-box-wrapper { text-align: center; }
  .image-box-img { margin-inline: auto !important; }
}

/* Icon box */
.icon-box-wrapper { display: flex; flex-direction: column; align-items: center; text-align: center; }
.position-left .icon-box-wrapper { flex-direction: row; }
.position-right .icon-box-wrapper { flex-direction: row-reverse; }
[dir='rtl'] .position-left .icon-box-wrapper { flex-direction: row-reverse; }
[dir='rtl'] .position-right .icon-box-wrapper { flex-direction: row; }
.icon-box-content .icon-box-title { margin: 0; }
.icon-box-content .icon-box-description { margin: 0; }
.icon-box-icon { display: inline-flex; flex: 0 0 auto; line-height: 1; }
.widget-icon-box .icon { display: inline-block; line-height: 1; transition: all 0.3s; font-size: 50px; color: #69727d; }
.widget-icon-box .icon i { width: 1em; height: 1em; position: relative; display: block; }
.widget-icon-box .icon i::before { position: absolute; left: 50%; transform: translateX(-50%); }
.view-framed .icon { padding: 0.5em; border: 3px solid; }
.view-stacked .icon { padding: 0.5em; background-color: #69727d; color: #fff; }
.shape-circle .icon { border-radius: 50%; }

/* Icon list */
.icon-list-items { list-style: none; margin: 0; padding: 0; }
.icon-list-item { display: flex; align-items: center; margin: 0; padding: 0; position: relative; font-size: inherit; }
.icon-list-item > a { display: flex; align-items: center; width: 100%; font-size: inherit; }
.icon-list-icon {
  display: flex;
  position: relative;
  top: var(--icon-vertical-offset, initial);
  align-self: var(--icon-vertical-align, center);
}
.icon-list-icon i {
  width: 1.25em;
  font-size: var(--e-icon-list-icon-size, 14px);
  text-align: var(--e-icon-list-icon-align, center);
  transition: color 0.3s;
}
.icon-list-text { align-self: center; padding-inline-start: 5px; }

/* Gallery: grid or justified rows, laid out by /js/site.js */
.gallery__container { display: flex; flex-wrap: wrap; gap: var(--gallery-gap, 12px); }
.gallery-item {
  position: relative;
  overflow: hidden;
  box-shadow: 0 3px 6px #00000029;
}
.gallery-item__image {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  border: var(--image-border-width, 0) solid var(--image-border-color, transparent);
  transition: transform var(--image-transition-duration, 0.8s);
}
/* Like the carousel, the live gallery switches layouts at its own thresholds: desktop from 1024px,
   tablet from 767px (one pixel off the rest of the site's breakpoints). */
.gallery__container { --gallery-columns: var(--gc, 4); --gallery-gap: var(--gg, 10px); }
@media (max-width: 1023px) { .gallery__container { --gallery-columns: var(--gc-t, 2); --gallery-gap: var(--gg-t, 10px); } }
@media (max-width: 766px) { .gallery__container { --gallery-columns: var(--gc-m, 1); --gallery-gap: var(--gg-m, 10px); } }
.gallery--grid .gallery-item { width: calc((100% - (var(--gallery-columns) - 1) * var(--gallery-gap)) / var(--gallery-columns)); }
/* Grid tiles: the live tiles measure exactly 2px taller than the aspect ratio of their width. */
.gallery--grid .gallery-item { container-type: inline-size; }
.gallery--grid .gallery-item__image { height: calc(100cqw * var(--gallery-ratio, 0.6667) + 2px); }
.gallery--justified .gallery-item { flex: 0 0 auto; }

/* Media carousel (own implementation, /js/site.js) */
.carousel { position: relative; overflow: hidden; width: 100%; touch-action: pan-y; }
/* The live carousel switches layouts at its own thresholds: desktop from 1024px, tablet from 767px. */
.carousel { --carousel-per-view: var(--cp, 3); --carousel-gap: var(--cg, 10px); }
@media (max-width: 1023px) { .carousel { --carousel-per-view: var(--cp-t, 2); --carousel-gap: var(--cg-t, 10px); } }
@media (max-width: 766px) { .carousel { --carousel-per-view: var(--cp-m, 1); --carousel-gap: var(--cg-m, 10px); } }
.carousel__track { display: flex; gap: var(--carousel-gap); height: 100%; will-change: transform; }
.carousel__slide { flex: 0 0 calc((100% - (var(--carousel-per-view) - 1) * var(--carousel-gap)) / var(--carousel-per-view)); height: 100%; }
.carousel-image {
  height: 100%;
  background-size: cover;
  background-position: center center;
}

/* Form */
.form-fields-wrapper { display: flex; flex-wrap: wrap; }
.field-group { display: flex; flex-wrap: wrap; align-items: center; }
.field-group.column { min-height: 0; }
.field-group .field, .field-textual {
  width: 100%;
  max-width: 100%;
  min-height: 40px;
  padding: 8px 14px;
  font-size: 15px;
  line-height: 1.4;
  color: #1f2124;
  background-color: #fff;
  border: 1px solid #69727d;
  border-radius: 3px;
  flex-grow: 1;
}
.field-group .field:focus { outline: 0; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1); }
.field-type-submit { display: flex; }
.form .button { border: none; padding-block: 0; min-height: 40px; width: 100%; }
.form .button-content-wrapper { display: flex; justify-content: center; }
@media (min-width: 768px) {
  .field-group.col-25 { width: 25%; } .field-group.col-33 { width: 33.333%; }
  .field-group.col-50 { width: 50%; } .field-group.col-100 { width: 100%; }
}
@media (max-width: 767px) {
  .field-group { width: 100%; }
}
/* Honeypot: invisible to people, filled in by bots (such submissions are dropped). */
/* Clipped in place, not moved off-screen: an offset of -10000px widened the page's scroll area in RTL. */
.form-hp { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.form-message { width: 100%; margin-block-start: 10px; font-size: 1em; }
/* Turnstile bot check: takes no space unless Cloudflare asks the visitor to tick its box. */
.form-turnstile { width: 100%; padding-inline: calc(var(--column-gap, 10px) / 2); }
.form-turnstile:empty { display: none; }
.form-message:empty { margin: 0; } /* takes no space until there is a message */
.form-message.is-success { color: #5cb85c; }
.form-message.is-error { color: #d9534f; }

/* Map embed */
.custom-embed { line-height: 0; }
.widget-google_maps iframe { height: 300px; width: 100%; border: 0; }

/* ---------- Navigation ---------- */
.nav-menu { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; position: relative; line-height: 1; }
.nav-menu li { display: block; position: relative; list-style: none; margin: 0; padding: 0; line-height: 20px; }
.nav-menu a { display: flex; align-items: center; line-height: 20px; padding: 10px 20px; transition: 0.4s; }
.nav-menu--main .nav-menu > li { display: flex; }
.nav-menu--main .nav-menu a { padding: 13px 20px; }
.nav-menu__align-center .nav-menu { justify-content: center; margin-inline: auto; }
/* Dropdowns open on hover or keyboard focus, with a short fade. The design leaves a 20px gap between an
   item and its dropdown, so an invisible bridge covers the gap, and on leaving the menu a dropdown stays
   for 0.3s, then fades out, closing at 0.5s (the live site's menu closes after 0.5s). Moving to a
   neighbouring item closes the other dropdown at once, so two never overlap.
   Like the live site, a dropdown is as wide as its longest option (at least 10em). */
.nav-menu--main .sub-menu {
  position: absolute;
  top: 100%;
  inset-inline-start: 0;
  min-width: 10em;
  width: max-content;
  max-width: 1000px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.2s 0.3s, visibility 0s 0.5s;
}
.nav-menu--main .sub-menu::before { content: ''; position: absolute; inset-inline: 0; bottom: 100%; height: 24px; }
.nav-menu--main .menu-item-has-children:hover > .sub-menu,
.nav-menu--main .menu-item-has-children:focus-within > .sub-menu,
.nav-menu--main .menu-item-has-children.is-open > .sub-menu {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.2s, visibility 0s;
}
.nav-menu--main .nav-menu:hover > li:not(:hover) > .sub-menu { visibility: hidden; opacity: 0; transition: none; }
/* Separators between options come from the design (a 1px bottom border); zero the other sides so every
   option box is the same size. */
.nav-menu li { border-width: 0; }
.nav-menu--main .sub-menu a { padding: 13px 20px; white-space: nowrap; }
.nav-menu--dropdown a { justify-content: space-between; }
.nav-menu__text-align-aside .nav-menu--dropdown a { justify-content: flex-start; }
.nav-menu--dropdown .nav-menu, .nav-menu--dropdown.nav-menu__container .nav-menu { flex-direction: column; }
.sub-arrow { display: flex; align-items: center; padding-inline-start: 10px; line-height: 1; }
/* Dropdown arrow (Ron's request; the live design shows none): a small chevron after "About" and "Services".
   It flips up while its menu is open: on hover or keyboard focus on desktop, on tap in the burger menu. */
.sub-arrow::before {
  content: '';
  width: 0.38em;
  height: 0.38em;
  border: solid currentColor;
  border-width: 0 2px 2px 0;
  transform: translateY(-25%) rotate(45deg);
  transition: transform 0.2s;
}
.nav-menu--main .menu-item-has-children:hover > a .sub-arrow::before,
.nav-menu--main .menu-item-has-children:focus-within > a .sub-arrow::before,
.nav-menu--dropdown .menu-item-has-children.is-open > a .sub-arrow::before { transform: translateY(25%) rotate(225deg); }
.nav-menu--main .nav-menu:hover > li:not(:hover) > a .sub-arrow::before { transform: translateY(-25%) rotate(45deg); }

/* Footer menus are always shown as a vertical list */
.widget-nav-menu:not(.nav-menu--toggle) .nav-menu--dropdown.nav-menu__container { display: block; }

/* Burger toggle and its dropdown */
.menu-toggle {
  display: none;
  width: max-content;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border: 0 solid;
  border-radius: 3px;
  padding: 0.25em;
  font-size: var(--nav-menu-icon-size, 22px);
  color: #33373d;
  background-color: rgba(0, 0, 0, 0.05);
}
.menu-toggle svg { width: 1em; height: 1em; fill: currentColor; }
.menu-toggle .icon-close { display: none; }
.menu-toggle[aria-expanded='true'] .icon-open { display: none; }
.menu-toggle[aria-expanded='true'] .icon-close { display: block; }
.nav-menu--toggle .nav-menu--dropdown.nav-menu__container {
  visibility: hidden;
  overflow: hidden;
  transform: scaleY(0);
  transform-origin: top;
  transition: transform 0.3s, visibility 0.3s;
}
.nav-menu--toggle .menu-toggle[aria-expanded='true'] + .nav-menu--dropdown.nav-menu__container {
  visibility: visible;
  max-height: 100vh;
  overflow-y: auto;
  transform: scaleY(1);
}
.nav-menu--stretch .nav-menu__container.nav-menu--dropdown { position: absolute; z-index: 9997; }
.nav-menu--dropdown .sub-menu { position: static; display: none; padding: 0; margin: 0; list-style: none; }
.nav-menu--dropdown .menu-item-has-children.is-open > .sub-menu { display: block; }
/* Phone and tablet menu: an open submenu reads as its own group (Ron's request). Its options sit on a darker
   green, indented, with fainter lines between them and a thin lime bar along their edge; the full white line
   under the group shows where the main options resume. White on #0e6c30 is 6.5:1. */
.kit .location-header .nav-menu--toggle .nav-menu--dropdown .sub-menu { border-inline-start: 4px solid var(--color-ba90683); }
.kit .location-header .nav-menu--toggle .nav-menu--dropdown .sub-menu a { padding-inline-start: 40px; background-color: #0e6c30; font-weight: 400; }
.kit .location-header .nav-menu--toggle .nav-menu--dropdown .sub-menu li:not(:last-child) { border-color: rgba(255, 255, 255, 0.3); }
/* The current page and a hovered or tapped option keep the design's lime highlight (with dark text). */
.kit .location-header .nav-menu--toggle .nav-menu--dropdown .sub-menu a:hover,
.kit .location-header .nav-menu--toggle .nav-menu--dropdown .sub-menu a:focus,
.kit .location-header .nav-menu--toggle .nav-menu--dropdown .sub-menu a.item-active,
.kit .location-header .nav-menu--toggle .nav-menu--dropdown .sub-menu a.highlighted { background-color: var(--color-ba90683); }
@media (min-width: 767px) {
  .kit .location-header .nav-menu--toggle .nav-menu--dropdown .sub-menu a { padding-inline-start: 52px; }
}
@media (min-width: 1025px) {
  .nav-menu--dropdown-tablet .menu-toggle,
  .nav-menu--dropdown-tablet .nav-menu--dropdown.nav-menu__container { display: none; }
}
@media (max-width: 1024px) {
  .nav-menu--dropdown-tablet .nav-menu--main { display: none; }
  .nav-menu--dropdown-tablet .menu-toggle { display: flex; }
}

/* ---------- Sticky header ---------- */
/* /js/site.js pins the header and leaves a hidden copy of it in the flow, so the gap it leaves
   is sized by the same CSS as the header itself (never by a JS measurement). */
.is-sticky { position: fixed !important; top: 0; inset-inline: 0; width: 100%; }
.sticky-spacer { visibility: hidden; }

/* ---------- Entrance animations ---------- */
.anim-pending { visibility: hidden; }
.animated { animation-duration: 1.25s; animation-fill-mode: both; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: none; } }
@keyframes fadeInLeft { from { opacity: 0; transform: translate3d(-100%, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes fadeInRight { from { opacity: 0; transform: translate3d(100%, 0, 0); } to { opacity: 1; transform: none; } }
.fadeIn { animation-name: fadeIn; }
.fadeInUp { animation-name: fadeInUp; }
.fadeInLeft { animation-name: fadeInLeft; }
.fadeInRight { animation-name: fadeInRight; }
@media (prefers-reduced-motion: reduce) {
  .anim-pending { visibility: visible; }
  .animated { animation: none; }
}

/* ---------- Not-found page (src/pages/404.astro) ---------- */
.not-found-section { padding: 120px 20px; }
.not-found { text-align: center; color: var(--color-text); font-family: var(--font-text-family), sans-serif; }
.not-found .heading-title { color: var(--color-primary); font-size: 42px; margin-block-end: 24px; }
.not-found p:not(:last-child) { margin-block-end: 20px; }
.kit .not-found a:not(.button) { color: var(--color-accent); text-decoration: underline !important; }

/* ---------- Added pages: investor relations, accessibility statement (src/lib/extra-pages.ts) ---------- */
/* Same look as the contact page's title band: beige section, dark title, 2px divider. Content sits on white
   cards, because the green links don't reach 4.5:1 contrast on beige. */
.extra-page .extra-section { background-color: var(--color-3c3fa38); }
.extra-page .extra-intro { padding: 60px 20px 10px; }
.extra-page .extra-body { padding: 20px 20px 80px; }
.extra-page .extra-section > .container { max-width: 1024px; }
.kit .extra-title { text-align: center; }
.kit .extra-title .heading-title { font-family: var(--font-accent-family), sans-serif; font-weight: var(--font-accent-weight); color: var(--color-secondary); }
.extra-divider { --divider-border-style: solid; --divider-color: #000; --divider-border-width: 2px; }
.extra-divider .divider { text-align: center; }
.extra-divider .divider-separator { width: 300px; margin: 0 auto; }
.ir, .statement { color: var(--color-text); font-family: var(--font-text-family), sans-serif; font-size: 18px; line-height: 1.6; }
/* minmax(0, 1fr): the wide financial table scrolls inside its card instead of widening the page. */
.ir, .ir-data { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.ir-intro { max-width: 820px; margin: 0 auto !important; text-align: center; }
.ir-intro { font-size: 20px; color: var(--color-secondary); }
.ir-block, .ir-loading, .statement { background: #fff; border-radius: 10px; padding: 28px 32px; }
.kit .ir-title { margin: 0 0 16px; font-size: 28px; line-height: 1.2; }
.ir p { margin: 0; }
/* !important: the design's kit removes underlines from every link (.doc a { text-decoration: inherit !important }). */
.kit .ir a:not(.button), .kit .statement a:not(.button) { color: var(--color-accent); text-decoration: underline !important; text-underline-offset: 3px; }
.kit .ir a:not(.button):hover, .kit .statement a:not(.button):hover { color: var(--color-secondary); }
.ir .ir-note { margin-block-start: 12px; font-size: 15px; }
.ir-figure { font-size: 26px; font-weight: 700; color: var(--color-secondary); font-variant-numeric: tabular-nums; }
.ir-figures, .ir-details { margin: 0; }
.ir-figures { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 16px 24px; }
.ir-figures dt { font-size: 15px; }
.ir-figures dd, .ir-details dd { margin: 0; color: var(--color-secondary); }
.ir-details { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px 24px; margin-block: 16px; }
.ir-details dt { font-size: 15px; }
.ir-report-list { list-style: none; margin: 0; padding: 0; }
.ir-report-list li { display: grid; grid-template-columns: 6.5em 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--color-3c3fa38); }
.ir-report-list time { color: var(--color-secondary); font-variant-numeric: tabular-nums; }
.kit .ir .ir-report-list a { color: var(--color-secondary); text-decoration-color: var(--color-accent); }
.kit .ir .ir-report-list a:hover { color: var(--color-accent); }
.ir-more { margin-block-start: 20px; }
/* Latest financial results: the layout of El Al's investor site (Ron's reference) in our colours. Large green
   figures with the shekel mark in red (never under 24px, where red counts as large text), labels underneath,
   thin lines between the cells only. */
.ir-results { --ir-line: #ddd5ca; padding: 48px 40px 40px; text-align: center; }
.kit .ir-results-title { margin: 0; font-size: 42px; line-height: 1.2; }
.ir .ir-results-date { margin-block-start: 8px; font-size: 15px; color: var(--color-secondary); }
.ir-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 36px 0 0; }
.ir-kpi { display: flex; flex-direction: column-reverse; align-items: center; justify-content: center; gap: 10px; padding: 32px 12px; }
.ir-kpi dt { font-size: 17px; color: var(--color-text); }
.ir-kpi dd { margin: 0; }
.ir-kpi-value { display: inline-flex; align-items: baseline; gap: 6px; font-size: 56px; font-weight: 500; line-height: 1; color: var(--color-accent); font-variant-numeric: tabular-nums; }
.ir-kpi-cur { font-size: max(24px, 0.5em); color: var(--color-primary); }
.ir .ir-results-note { margin-block-start: 20px; font-size: 14px; }
.ir .ir-results-more { margin-block-start: 28px; }
.kit .ir a.ir-outline-button {
  display: inline-block;
  padding: 12px 32px;
  border: 1.5px solid var(--color-accent);
  border-radius: 10px;
  color: var(--color-accent);
  font-weight: 500;
  text-decoration: none !important;
  transition: background-color 0.2s, color 0.2s;
}
.kit .ir a.ir-outline-button:hover, .kit .ir a.ir-outline-button:focus-visible { background-color: var(--color-accent); color: #fff; }
@media (min-width: 767px) {
  .ir-kpi + .ir-kpi { border-inline-start: 1px solid var(--ir-line); }
  .ir-kpi:nth-child(3n + 1) { border-inline-start: 0; }
  .ir-kpi:nth-child(n + 4) { border-block-start: 1px solid var(--ir-line); }
}
@media (min-width: 767px) and (max-width: 1023px) {
  .ir-kpi-value { font-size: 44px; }
}
@media (max-width: 766px) {
  .ir-results { padding: 32px 12px 28px; }
  .kit .ir-results-title { font-size: 28px; }
  .ir-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-block-start: 24px; }
  .ir-kpi { padding: 22px 6px; }
  .ir-kpi:nth-child(2n) { border-inline-start: 1px solid var(--ir-line); }
  .ir-kpi:nth-child(n + 3) { border-block-start: 1px solid var(--ir-line); }
  .ir-kpi dt { font-size: 15px; }
  .ir-kpi-value { font-size: 34px; gap: 4px; }
  .kit .ir a.ir-outline-button { display: block; }
}
/* Read by screen readers, not shown. */
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.statement { max-width: 900px; margin: 0 auto; }
.statement p, .statement ul { margin: 0 0 16px; }
.statement ul { padding-inline-start: 1.4em; }
.statement li + li { margin-block-start: 6px; }
.kit .statement h2 { margin: 32px 0 12px; font-size: 28px; }
.statement .statement-date { margin: 32px 0 0; font-size: 15px; }
.kit .statement h3 { margin: 20px 0 6px; font-size: 20px; color: var(--color-secondary); }

/* Footer bottom bar: legal links and copyright (LAYOUT_REPLACED in src/lib/overrides.ts). White on #222. */
.footer-legal .legal-links { display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style: none; }
.footer-legal .legal-links li + li { border-inline-start: 1px solid rgba(255, 255, 255, 0.5); }
.footer-legal .legal-links a { display: inline-block; padding: 2px 14px; color: #fff; }
.kit .footer-legal .legal-links a:hover,
.kit .footer-legal .legal-links a:focus-visible { color: var(--color-ba90683); text-decoration: underline !important; }
.footer-legal .legal-copy { margin: 6px 0 0; font-size: 14px; }
@media (max-width: 766px) {
  .extra-page .extra-intro { padding: 40px 12px 0; }
  .extra-page .extra-body { padding: 20px 12px 60px; }
  .extra-divider .divider-separator { width: 200px; }
  .ir, .statement { font-size: 16px; }
  .ir-intro { font-size: 18px; }
  .ir-block, .ir-loading, .statement { padding: 20px 16px; }
  .kit .ir-title, .kit .statement h2 { font-size: 24px; } /* 24px counts as large text: the red needs 3:1, not 4.5:1 */
  .ir-figure { font-size: 22px; }
  .ir-report-list li { grid-template-columns: 1fr; gap: 2px; }
  .ir-details { grid-template-columns: 1fr; gap: 12px; }
}

/* ---------- Settlement notice as text (page 785; audit finding #3) ---------- */
/* Laid out like the published newspaper notice: a framed box, underlined headings, numbered paragraphs. */
.settlement-notice .notice-text {
  max-width: 900px;
  margin: 0 auto;
  padding: 28px 36px;
  background: #fff;
  border: 2px solid var(--color-secondary);
  color: var(--color-secondary);
  font-family: var(--font-text-family), sans-serif;
  font-size: 17px;
  line-height: 1.6;
  text-align: start;
}
.kit .settlement-notice .notice-title { margin: 0 0 12px; font-size: 26px; color: var(--color-secondary); text-align: center; text-decoration: underline; }
.kit .settlement-notice .notice-heading { margin: 20px 0 8px; font-size: 20px; color: var(--color-secondary); text-decoration: underline; text-transform: none; }
.settlement-notice p { margin: 0 0 12px; }
.settlement-notice .notice-list { margin: 0; padding-inline-start: 1.8em; }
.settlement-notice .notice-list li + li { margin-block-start: 6px; }
.settlement-notice .notice-source { margin: 16px 0 0; text-align: center; font-size: 16px; }
.kit .settlement-notice .notice-source a { color: var(--color-secondary); text-decoration: underline !important; }
@media (max-width: 766px) {
  .settlement-notice .notice-text { padding: 20px 16px; font-size: 16px; }
  .kit .settlement-notice .notice-title { font-size: 22px; }
}

/* ---------- Contact page (HE): investor-contact block removed (Ron's request) ---------- */
/* The map floats (position: absolute) beside the contact details, so it never stretches its section. The
   removed block used to keep that column taller than the map; without it the map spilled over the form
   below. On tablet and desktop the column now keeps at least the map's height (400px / 300px iframe plus
   its border and the original spacing). On phones the design overlaps the map onto the next section on
   purpose, as on the live site. */
@media (min-width: 1025px) { .doc-25 .element.el-7ba2587 { min-height: 404px; } }
@media (min-width: 768px) and (max-width: 1024px) { .doc-25 .element.el-7ba2587 { min-height: 340px; } }

/* ---------- Colour contrast (Ron's request, accessibility audit finding #2) ---------- */
/* The design's own rules hard-code the old green on the customer-login button and the menu button style, and
   put white text on the lime hover colours (#B8D232, #C1D101: 1.7:1). Those get the darker green and dark text
   (9:1 on lime). !important matches the rules being overridden. */
.kit .menu-button a { background-color: var(--color-accent) !important; }
.kit .menu-button a:hover,
.kit .menu-button a:focus { color: var(--color-secondary) !important; }
.kit .nav-btn a { background: var(--color-accent); }
.kit .nav-btn:hover a { color: var(--color-secondary) !important; }
.kit .button:hover,
.kit .button:focus,
.kit .location-header .nav-menu--dropdown a:hover,
.kit .location-header .nav-menu--dropdown a:focus,
.kit .location-header .nav-menu--dropdown a.item-active,
.kit .location-header .nav-menu--dropdown a.highlighted { color: var(--color-secondary) !important; }

/* Customer-login dropdown (desktop): the design styles every link inside .menu-button as the green pill
   button; its two options are ordinary dropdown options instead, like those under "About". The button sits at
   the screen's far left, so its dropdown lines up with the button's left edge and opens inward. */
.nav-menu--main .menu-button > .sub-menu { inset-inline-start: auto; inset-inline-end: 0; }
.kit .menu-button .sub-menu a {
  padding: 13px 20px !important;
  border-radius: 0 !important;
  background-color: var(--color-accent) !important;
  transform: none !important;
}
.kit .menu-button .sub-menu a:hover,
.kit .menu-button .sub-menu a:focus { background-color: var(--color-ba90683) !important; }
.kit .menu-button .sub-menu li:first-child > a { border-start-start-radius: 10px !important; border-start-end-radius: 10px !important; }
.kit .menu-button .sub-menu li:last-child > a { border-end-start-radius: 10px !important; border-end-end-radius: 10px !important; }

/* ---------- Accessibility ---------- */
.skip-link {
  position: absolute;
  inset-inline-start: 16px;
  top: -100px;
  z-index: 100000;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  background: #fff;
  color: #222;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  font-size: 16px;
}
.skip-link:focus { top: 16px; outline: 2px solid var(--color-accent); }

/* Toolbar rules are prefixed with .kit so the design's general button style (uneven 14px/20px padding)
   can't override them: that padding pushed the icon off-centre. */
.kit .a11y-toggle {
  position: fixed;
  bottom: 24px;
  inset-inline-start: 24px;
  z-index: 99999;
  width: 56px;
  height: 56px;
  padding: 0;
  border-radius: 10px;
  border: 0;
  background-color: var(--color-accent);
  color: #fff;
  cursor: pointer;
  display: grid;
  place-items: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}
.kit .a11y-toggle svg { width: 30px; height: 30px; fill: currentColor; display: block; }
.a11y-panel {
  position: fixed;
  bottom: 92px;
  inset-inline-start: 24px;
  z-index: 99999;
  width: 280px;
  padding: 16px;
  background: #fff;
  color: #222;
  border-radius: 12px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25);
  font-family: var(--font-text-family), sans-serif;
  font-size: 16px;
}
.a11y-panel[hidden] { display: none; }
.kit .a11y-panel h2 { margin: 0 0 12px; font-size: 22px; line-height: 1.2; color: var(--color-primary); }
.kit .a11y-panel button {
  display: block;
  width: 100%;
  margin-block-end: 8px;
  padding: 10px 12px;
  border: 0;
  border-radius: 10px;
  background-color: var(--color-accent);
  color: #fff;
  text-align: start;
  cursor: pointer;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.3;
}
/* An option that is on: dark background, white text, check mark (readable, unlike a light highlight). */
.kit .a11y-panel button[aria-pressed='true'] { background-color: var(--color-secondary); }
.kit .a11y-panel button[aria-pressed='true']::after { content: ' ✓'; }
.a11y-panel .a11y-statement { display: block; margin-block-start: 4px; color: var(--color-accent); text-decoration: underline; text-underline-offset: 3px; }
/* Filters go on the root element: on <body> they would turn the pinned header and this toolbar into
   scrolling elements (a filtered element becomes the containing block of its fixed descendants). */
html.a11y-big-text body { zoom: 1.2; }
html.a11y-contrast { filter: contrast(1.6); }
html.a11y-grayscale { filter: grayscale(1); }
html.a11y-contrast.a11y-grayscale { filter: contrast(1.6) grayscale(1); }
html.a11y-links a { text-decoration: underline !important; }
html.a11y-readable body, html.a11y-readable .doc * { font-family: Arial, Helvetica, sans-serif !important; }
html.a11y-no-motion *, html.a11y-no-motion *::before, html.a11y-no-motion *::after {
  animation: none !important;
  transition: none !important;
}
html.a11y-no-motion .anim-pending { visibility: visible; }