/* Heebo, self-hosted (SIL OFL, fonts/OFL.txt): no visitor data goes to Google */
@font-face { font-family: 'Heebo'; font-weight: 400 800; font-display: swap; src: url(fonts/heebo-hebrew.woff2) format('woff2'); unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family: 'Heebo'; font-weight: 400 800; font-display: swap; src: url(fonts/heebo-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
html { scroll-behavior: smooth; scroll-padding-top: 4rem; }
body { font-family: 'Heebo', sans-serif; }
:focus-visible { outline: 3px solid #0E7C7C; outline-offset: 2px; }
summary::-webkit-details-marker { display: none; }

/* FAQ: + on the right (start side in RTL), − when open */
.faq > summary { list-style: none; display: flex; gap: .75rem; align-items: baseline; }
.faq > summary::before { content: "+"; color: #0E7C7C; font-size: 1.5rem; font-weight: 800; line-height: 1; width: 1rem; flex-shrink: 0; }
.faq[open] > summary::before { content: "−"; }

/* Message after a mail link click (mailto.js): navy on white text, 15:1 */
.mailto-toast { position: fixed; bottom: 1.5rem; left: 50%; transform: translateX(-50%); z-index: 50; width: max-content; max-width: calc(100% - 2rem); padding: .75rem 1.25rem; border-radius: .75rem; background: #0B1F4B; color: #fff; text-align: center; box-shadow: 0 10px 25px rgb(0 0 0 / .25); }
.mailto-toast:empty { display: none; }

/* Opsolute loader (contact form while sending): the three nodes travel clockwise between the
   sockets of the mark. --op-size resizes it, --op-speed is one full loop. */
.op-loader { --op-size: 120px; --op-speed: 2.7s; position: relative; width: var(--op-size); aspect-ratio: 675/609; max-width: 100%; }
.op-loader > img { display: block; width: 100%; height: 100%; user-select: none; -webkit-user-drag: none; }
.op-orbit { position: absolute; inset: 0; transform-origin: 50.28% 61.98%; animation: op-orbit var(--op-speed) infinite; }
.op-dot { position: absolute; width: 12.6%; aspect-ratio: 1; border-radius: 50%; transform: translate(-50%, -50%); background: var(--a); animation: op-color var(--op-speed) infinite; }
.op-dot.op-1 { left: 50.28%; top: 16.54%; --a: #0fb2b8; --b: #5fbff3; --c: #11305a; }
.op-dot.op-2 { left: 85.78%; top: 84.69%; --a: #5fbff3; --b: #11305a; --c: #0fb2b8; }
.op-dot.op-3 { left: 14.78%; top: 84.69%; --a: #11305a; --b: #0fb2b8; --c: #5fbff3; }
@keyframes op-orbit {
  0% { transform: rotate(0deg); animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
  26%, 33.33% { transform: rotate(120deg); animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
  59.33%, 66.66% { transform: rotate(240deg); animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
  92.66%, 100% { transform: rotate(360deg); }
}
@keyframes op-color {
  0% { background: var(--a); animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
  26%, 33.33% { background: var(--b); animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
  59.33%, 66.66% { background: var(--c); animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
  92.66%, 100% { background: var(--a); }
}
/* reduced motion: the mark stands still; the status text says it is sending */
@media (prefers-reduced-motion: reduce) { .op-orbit, .op-dot { animation: none; } }