@font-face{
  font-family:Rubik;
  src:url(fonts/rubik-700-latin.woff2) format("woff2");
  font-weight:700;
  font-display:swap;
  unicode-range:U+0000-00FF;
}
@font-face{
  font-family:Rubik;
  src:url(fonts/rubik-700-hebrew.woff2) format("woff2");
  font-weight:700;
  font-display:swap;
  unicode-range:U+0590-05FF,U+FB1D-FB4F;
}
:root{color-scheme:light;--paper:#fcfcfa;--ink:#161615;--muted:#575752;--line:#deded8;--accent:#3148bc;--soft:#f1f1f7;--indigo:#3248cb;--night:#161c37;--ease:cubic-bezier(.2,.75,.25,1);--page-gutter:clamp(18px,4vw,40px)}
html[dir=rtl]{--inline-end:-1;--glow-origin:0%}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-block-start:80px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-size:16px;line-height:1.55}
a{color:inherit;text-decoration:none}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.shell{width:min(70rem,calc(100% - 2 * var(--page-gutter)));margin-inline:auto}
.skip{position:fixed;inset-inline-start:12px;top:-80px;background:white;padding:10px;z-index:12}
.skip:focus{top:12px}
.site-header{
  position:sticky;
  inset-block-start:0;
  z-index:10;
  background:var(--paper);
  border-block-end:1px solid var(--line);
}
@supports(backdrop-filter:blur(12px)){
  .site-header{background:#fcfcfaf5;backdrop-filter:blur(12px)}
}
.header.shell{
  width:calc(100% - 2 * var(--page-gutter));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding-block:10px;
}
.header-actions{display:flex;align-items:center;gap:clamp(3px,1.3vw,14px)}
.brand{display:inline-flex;align-items:center;min-height:44px;font-weight:820;font-size:clamp(2.05rem,3.4vw,3.25rem);letter-spacing:-.075em;line-height:1;white-space:nowrap}
.brand-letter{display:inline-block}
.brand-accent{color:var(--accent)}
@media(prefers-reduced-motion:no-preference){
  .brand-letter{animation:wordmark-hop 20s ease-in-out infinite}
  .brand-letter:nth-child(2){animation-delay:.045s}
  .brand-letter:nth-child(3){animation-delay:.09s}
  .brand-letter:nth-child(4){animation-delay:.135s}
  .brand-letter:nth-child(5){animation-delay:.18s}
  .brand-letter:nth-child(6){animation-delay:.225s}
  .brand-letter:nth-child(7){animation-delay:.27s}
  .brand-letter:nth-child(8){animation-delay:.315s}
  .brand-letter:nth-child(9){animation-delay:.36s}
  .brand-letter:nth-child(10){animation-delay:.405s}
}
@keyframes wordmark-hop{
  0%,94.5%,100%{transform:translateY(0)}
  96.5%{transform:translateY(-4px)}
  98%{transform:translateY(1px)}
}
.header-contact{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding-inline:16px;
  border-radius:999px;
  color:var(--accent);
  font-size:.88rem;
  font-weight:690;
  white-space:nowrap;
}
.language-switch{
  position:relative;
  inline-size:44px;
  block-size:44px;
}
.language-switch[open]{inline-size:78px}
.language-switch summary{
  display:grid;
  place-items:center;
  inline-size:100%;
  block-size:100%;
  border:1px solid transparent;
  border-radius:999px;
  list-style:none;
  cursor:pointer;
  transition:background-color .22s,border-color .22s;
}
.language-switch summary::-webkit-details-marker{display:none}
.language-switch summary img{transition:opacity .18s,transform .22s var(--ease)}
.language-switch[open] summary{background:#eff2ff;border-color:#dce1f6}
.language-switch[open] summary img{opacity:0;transform:scale(.65)}
.language-options{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  color:var(--muted);
  font-size:.75rem;
  font-weight:650;
  pointer-events:none;
}
@keyframes language-labels{from{opacity:0;transform:scale(.86)}to{opacity:1;transform:none}}
.language-options a,.language-options [aria-current]{
  display:inline-grid;
  place-items:center;
  min-block-size:44px;
  min-inline-size:21px;
}
.language-options a{min-inline-size:44px;color:var(--accent);border-radius:999px;pointer-events:auto}
.language-hint{
  position:absolute;
  inset-block-start:calc(100% + 8px);
  inset-inline-start:3px;
  padding:6px 11px;
  border:1px solid #dce1f6;
  border-radius:8px;
  background:#fff;
  color:var(--accent);
  box-shadow:0 4px 12px #253c6b26;
  font-size:.875rem;
  font-weight:650;
  white-space:nowrap;
  pointer-events:none;
}
.language-hint::before{
  content:"";
  position:absolute;
  inset-block-start:-5px;
  inset-inline-start:14px;
  inline-size:8px;
  block-size:8px;
  border-block-start:1px solid #dce1f6;
  border-inline-start:1px solid #dce1f6;
  background:inherit;
  transform:rotate(45deg);
}
@media(prefers-reduced-motion:no-preference){
  .language-hint{
    transform-origin:19px -5px;
    animation:language-hint-swing 3.8s ease-in-out both;
  }
}
@keyframes language-hint-swing{
  0%{transform:rotate(-4deg)}
  25%{transform:rotate(4deg)}
  50%{transform:rotate(-3deg)}
  75%{transform:rotate(2deg)}
  100%{transform:rotate(0deg)}
}
.language-switch[open] .language-hint{display:none}
.footer a,.header .brand{transition:color .2s}
@media(hover:hover){
  .language-switch{transition:inline-size .24s var(--ease)}
  .language-switch[open] .language-options{animation:language-labels .17s .08s var(--ease) both}
  .language-switch summary:hover,.language-options a:hover{background:#e2e9ff}
  .footer a:hover,.header .brand:hover{color:var(--accent)}
}
@media(max-width:420px){
  .brand{font-size:clamp(1.65rem,7.1vw,2rem)}
  .header-contact{padding-inline:8px;font-size:.79rem}
}
html[lang=he] :is(h1,h2,h3){letter-spacing:normal;line-height:1.15}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{letter-spacing:-.055em;line-height:1.04}
h1{font-size:clamp(3.7rem,9vw,7.8rem);font-weight:760;margin:5px auto 24px}
h2{font-size:clamp(2.7rem,5.6vw,4.65rem);font-weight:740;margin-bottom:19px}
.lede{max-width:49ch;margin:0 auto 30px;font-size:clamp(1.05rem,1.85vw,1.25rem);color:var(--muted)}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:1px solid var(--line);
  border-radius:999px;
  padding:7px;
  padding-inline-start:17px;
  font:inherit;
  font-weight:690;
  font-size:.9rem;
  cursor:pointer;
}
.primary{min-height:46px;--action-edge:#9cacee;--action-halo:#7088ed9c}

/* The luminous edge travels around the action without filling its face. */
@property --glow-turn{
  syntax:"<angle>";
  initial-value:30deg;
  inherits:false;
}
.glow-action{
  border:1px solid transparent;
  /* Chromium updates the animated angle when the gradient uses background-image. */
  background-clip:padding-box,border-box;
  background-image:
    linear-gradient(var(--action-surface,#fff),var(--action-surface,#fff)),
    conic-gradient(from var(--glow-turn,30deg),var(--action-edge,#b2bff1) 0%,#e6ecff 29%,#7187e6 46%,#a7bcff 58%,var(--action-edge,#b2bff1) 83%);
  color:var(--action-ink,var(--accent));
  box-shadow:var(--action-shadow,0 0 0 1px #b2c2ff24,0 0 15px -5px var(--action-halo,#899df285));
  transition:box-shadow .24s var(--ease),transform .24s var(--ease);
}
.glow-action[aria-current=page],.glow-action[aria-pressed=true]{
  --action-edge:#7289e4;
  --action-halo:#8099ffab;
}
.glow-action.contact-action{
  --contact-ring:#2451e6;
  --action-shadow:0 0 0 1px #3267ff35,0 0 10px #3267ff65,0 0 21px -3px #3267ff80;
  --action-highlight:0 0 0 1px #3267ff50,0 0 12px #3267ff85,0 0 24px -2px #3267ff9e;
  border-width:3px;
  background-image:
    linear-gradient(var(--action-surface,#fff),var(--action-surface,#fff)),
    conic-gradient(from var(--glow-turn,30deg),var(--contact-ring) 0% 61%,#386eff 73%,#68acff 84%,#a5d7ff 90%,#5686ff 96%,var(--contact-ring) 100%);
}
.glow-action:focus-visible{
  box-shadow:var(--action-highlight,0 0 0 1px #9aafff75,0 0 17px -2px var(--action-halo,#899df2a0));
}
@media(hover:hover){
  .glow-action:hover{
    box-shadow:var(--action-highlight,0 0 0 1px #9aafff75,0 0 19px -2px var(--action-halo,#899df2a0));
  }
}
@media(prefers-reduced-motion:no-preference){
  .button .icon{transition:translate .24s var(--ease)}
  @media(hover:hover){
    .glow-action:hover{animation:glow-sweep 1.45s var(--ease)}
    .button:hover .icon-out{translate:calc(2px * var(--inline-end,1)) -2px}
  }
  .glow-action:active{transform:scale(.97)}
  .glow-action.contact-action{animation:glow-sweep 7.5s linear infinite}
}
@keyframes glow-sweep{to{--glow-turn:390deg}}
@media(forced-colors:active){
  .glow-action{border-color:ButtonText}
}
.section{padding-block:clamp(40px,5vw,76px);scroll-margin:18px}
.subpage h1{font-size:clamp(2.35rem,5.6vw,4.65rem);font-weight:740;margin:0 0 19px}
.section-heading>p{max-width:55ch;margin-inline:auto;color:var(--muted)}
.section-heading>p:last-child{margin-block-end:0}
.number{font-variant-numeric:tabular-nums;font-size:.76rem;font-weight:650;color:var(--muted)}
.icon{display:inline-block;flex:none;vertical-align:-.18em}
[dir=rtl] .icon-out{transform:scaleX(-1)}
.button .icon{
  box-sizing:content-box;
  inline-size:14px;
  block-size:14px;
  padding:7px;
  border-radius:50%;
  background:#3148bc15;
}
@keyframes arrive{from{opacity:.25;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
.home-section{padding-block:clamp(36px,5vw,64px);text-align:center}
.home-section h2{font-size:clamp(2.1rem,4.2vw,3.5rem);margin-bottom:14px}
.home-section h3{font-size:clamp(1.2rem,2vw,1.55rem);margin-bottom:9px}
.home-section p{margin-bottom:0;color:var(--muted)}
.home-process{
  display:grid;
  justify-items:center;
  gap:clamp(22px,3.1vw,38px);
  padding-block:clamp(44px,6vw,78px);
}
.home-process h2{margin:0}
.home-steps{
  --step-size:46px;
  --step-gap:clamp(18px,3vw,40px);
  display:grid;
  inline-size:100%;
  max-inline-size:55rem;
  gap:var(--step-gap);
  list-style:none;
  margin:0;
  padding:0;
}
.home-steps li{
  position:relative;
  display:grid;
  justify-items:center;
  align-content:start;
  gap:10px;
  font-size:clamp(1.13rem,1.85vw,1.4rem);
  font-weight:680;
  line-height:1.3;
}
.home-steps .number{
  z-index:1;
  display:grid;
  place-items:center;
  inline-size:var(--step-size);
  block-size:var(--step-size);
  border:1px solid #cfd7f3;
  border-radius:50%;
  background:#f2f4ff;
  color:var(--accent);
  font-size:.88rem;
  transition:background-color .24s var(--ease),border-color .24s var(--ease),color .24s var(--ease);
}
.home-steps li.is-filled .number{
  background:#3b54c9;
  border-color:#3b54c9;
  color:#fff;
}
@media(min-width:761px){
  .home-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
  .home-steps li:not(:last-child)::before,
  .home-steps li:not(:last-child)::after{
    content:"";
    position:absolute;
    inset-block-start:calc(var(--step-size) / 2);
    inset-inline:50% calc(-50% - var(--step-gap));
    border-block-start:1px solid #bfc9ef;
  }
  .home-steps li:not(:last-child)::after{
    border-block-start-color:#667ddd;
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .26s ease-out;
  }
  [dir=rtl] .home-steps li:not(:last-child)::after{transform-origin:right}
  .home-steps li.is-filled:not(:last-child)::after{transform:scaleX(1)}
}
.home-contact{display:grid;justify-items:center;gap:20px}
.footer{padding-block:10px;border-block-start:1px solid var(--line);color:var(--muted);font-size:.82rem;text-align:center}
.footer p{margin:0}
.footer a{display:inline-flex;align-items:center;min-height:44px;padding-inline:4px;font-weight:650}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Homepage and workflow demo */
.home :is(.hero,.home-services,.home-process) {
  width:100%;
  padding-inline:max(var(--page-gutter),calc((100% - 70rem) / 2));
}
.hero {
  display:grid;
  justify-items:center;
  text-align:center;
  gap:clamp(24px,4vw,52px);
  padding-block:clamp(36px,5.4vw,76px);
  background:radial-gradient(ellipse 55rem 38rem at 50% 0,#e5e8ff,transparent 100%),#f8f7fd;
}
.hero h1 {
  font-family:Rubik,system-ui,sans-serif;
  font-size:clamp(1.85rem,5.2vw,4.125rem);
  font-weight:700;
  line-height:1.02;
  letter-spacing:-.045em;
  margin:0 0 20px;
  text-wrap:balance;
}
html[lang=he] .hero h1 { font-size:clamp(1.65rem,6.1vw,5.25rem);line-height:1.08;letter-spacing:-.035em; }
.hero h1 em { color:var(--accent);font-style:normal; }
.hero .lede { margin:0 auto 22px;max-width:53ch; }
.hero-contact { min-inline-size:min(100%,14rem);padding-inline:20px; }

.hero-panel {
  position:relative;
  isolation:isolate;
  container-type:inline-size;
  inline-size:min(100%,42rem);
  text-align:start;
  padding:clamp(18px,2.5vw,28px);
  border:1px solid #333b64;
  border-radius:21px;
  background:linear-gradient(145deg, #252c55, var(--night) 68%);
  color:#fff;
  box-shadow:0 28px 70px -40px #171c5e, 0 8px 18px -13px #171c5e;
  animation:panel-arrive .6s var(--ease) both;
}
.demo-top { margin-block-end:19px; }
.demo-top h2 { margin:0;font-size:clamp(1.3rem,2.8vw,1.9rem);letter-spacing:-.036em; }
.demo-kicker { margin:0 0 5px;color:#c2ccff;font-size:.72rem;font-weight:700; }
/* Watermelon Fluid Tabs: icon and label over a shared sliding pill. */
.demo-controls {
  --tab-gap:4px;
  --tab-inset:4px;
  --tab-fill:linear-gradient(#fff,#e6ebff);
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--tab-gap);
  padding:var(--tab-inset);
  margin-block-end:12px;
  border:1px solid #c6cef3;
  border-radius:999px;
  background:#c6cef3;
}
.demo-controls[hidden] { display:grid!important;visibility:hidden; }
.demo-controls button {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:0;
  padding:6px 8px;
  min-height:44px;
  border:1px solid transparent;
  border-radius:999px;
  background:transparent;
  color:#34406a;
  font:inherit;
  font-size:.84rem;
  font-weight:690;
  line-height:1.2;
  cursor:pointer;
  transition:background-color .2s,border-color .2s,scale .18s var(--ease);
}
.demo-controls button img {
  flex:none;
  transition:scale .22s var(--ease);
}
.demo-controls button[aria-pressed=true] { background:var(--tab-fill);color:#212a51; }
.demo-controls button:focus-visible { outline:2px solid currentColor;outline-offset:-4px; }
@media (hover:hover) {
  .demo-controls button:not([aria-pressed=true]):hover { background-color:#d7ddf8;border-color:#8d9cd3; }
}
@media (prefers-reduced-motion:no-preference) {
  .demo-controls button[aria-pressed=true] img { scale:1.08; }
  .demo-controls button:active { scale:.96; }
}
@supports selector(:has(*)) {
  .demo-controls {
    --tab-step:calc(100% + var(--tab-gap));
    --tab-index:0;
  }
  [dir=rtl] .demo-controls { --tab-step:calc(-100% - var(--tab-gap)); }
  .demo-controls:has(button:nth-of-type(2)[aria-pressed=true]) { --tab-index:1; }
  .demo-controls:has(button:nth-of-type(3)[aria-pressed=true]) { --tab-index:2; }
  .demo-controls::before {
    content:"";
    position:absolute;
    inset-block:var(--tab-inset);
    inset-inline-start:var(--tab-inset);
    inline-size:calc((100% - 2 * (var(--tab-inset) + var(--tab-gap))) / 3);
    border-radius:999px;
    background:var(--tab-fill);
    box-shadow:inset 0 0 0 1px #717faf,0 2px 5px #1827543d;
    pointer-events:none;
    transform:translateX(calc(var(--tab-index) * var(--tab-step)));
    transition:transform .32s var(--ease);
  }
  .demo-controls button[aria-pressed=true] { background:none; }
}
@container (max-width:25rem) {
  .demo-controls button {
    display:grid;
    justify-items:center;
    align-content:center;
    grid-template-rows:auto minmax(2.4em,auto);
    gap:3px;
    min-height:57px;
    padding-inline:4px;
    font-size:.76rem;
  }
  .demo-controls button span { overflow-wrap:anywhere; }
}
@media (forced-colors:active) {
  .demo-controls button { grid-template-rows:auto; }
  .demo-controls button[aria-pressed=true] { border:3px double Highlight;color:ButtonText; }
  .demo-controls button img { display:none; }
  .demo-controls::before { content:none; }
}
.demo-data {
  padding:12px clamp(8px,1.7vw,14px);
  border:1px solid #414a74;
  border-radius:12px;
  background:#111730;
}
.demo-rows { margin:0;padding:0;list-style:none; }
.demo-rows li,.demo-skeleton i {
  display:grid;
  grid-template-columns:1.6rem minmax(0,1fr);
  align-items:center;
  gap:7px;
  min-height:45px;
  border-top:1px solid #313958;
}
.demo-rows li,.demo-skeleton i { padding-block:8px; }
.demo-rows li:first-child,.demo-skeleton i:first-child { border-top:0; }
.demo-rows li { color:#f4f5ff;font-size:.92rem;line-height:1.4; }
.demo-rows li bdi { color:#c2ccff;font-size:.7rem;font-variant-numeric:tabular-nums; }
.demo-skeleton i::before,.demo-skeleton i::after {
  content:"";
  width:76%;
  height:8px;
  border-radius:4px;
  background:linear-gradient(90deg, #313b65, #596594, #313b65) 100% / 230% 100%;
  animation:sample-load 1s linear infinite;
}
.demo-skeleton i::after { width:72%; }
.demo-status { margin:0;color:#ffdfb2;font-size:.8rem; }
.demo-status:not(:empty) { margin-block-start:10px; }
[data-state=ready] .demo-rows { animation:arrive .22s var(--ease) both; }

.home-services { background:#f0f4fc;border-block:1px solid #dfe5f3; }
.home .home-process { background:#f7f6ef;border-block-end:1px solid #e9e6da; }
.home-contact {
  margin-block:clamp(34px,6vw,68px);
  padding:clamp(25px,5vw,54px);
  background:
    radial-gradient(ellipse at var(--glow-origin,100%) 0%,#4e61b58c,transparent 66%),
    linear-gradient(150deg,#27316b,var(--night) 74%);
  border:1px solid #2f3b70;
  border-radius:22px;
  color:#fff;
}
.home-contact p { color:#e0e5ff; }
.home-contact .primary{
  --action-surface:#222b55;
  --action-ink:#f0f3ff;
  --contact-ring:#4b76ff;
}
.home-contact .primary .icon{filter:invert(1);background:#0003}
.home-contact .primary:focus-visible{outline-color:#b3bfff}

.home-contact.reveal { animation:section-arrive .54s var(--ease) both; }
@media(prefers-reduced-motion:no-preference){
  .home-services.reveal .home-offerings article{animation:section-arrive .42s var(--ease) both}
  .home-services.reveal .home-offerings article:nth-child(2){animation-delay:.055s}
  .home-services.reveal .home-offerings article:nth-child(3){animation-delay:.11s}
}
@keyframes panel-arrive { from { transform:translateY(10px); } to { transform:none; } }
@keyframes section-arrive { from { opacity:.68;transform:translateY(14px); } to { opacity:1;transform:none; } }
@keyframes sample-load { to { background-position:-70% 0; } }
@supports (animation-timeline:scroll()) {
  @media (prefers-reduced-motion:no-preference) {
    body::before {
      content:"";
      position:fixed;
      z-index:11;
      inset:0 0 auto;
      height:3px;
      background:var(--indigo);
      pointer-events:none;
      transform-origin:left;
      animation:scroll-progress linear both;
      animation-timeline:scroll();
    }
    [dir=rtl] body::before { transform-origin:right; }
  }
}
@keyframes scroll-progress { from { transform:scaleX(0); } to { transform:scaleX(1); } }

/* Contact page */
.contact{
  display:grid;
  justify-items:center;
  gap:clamp(20px,4vw,36px);
  text-align:center;
}
.contact-card{
  inline-size:min(100%,38rem);
  background:radial-gradient(ellipse at var(--glow-origin,100%) 0%,#e1e7ff,transparent 68%),#f8f9ff;
  border:1px solid #d7def5;
  padding:clamp(20px,4vw,32px);
  border-radius:20px;
  box-shadow:0 15px 34px -26px #263eb270;
}
.contact-card h2{font-size:1.4rem;margin-bottom:10px}
.contact-card p{color:var(--muted)}
.contact-card p:last-child{margin-bottom:0}
.business-email{width:fit-content;overflow-wrap:anywhere;margin-top:10px;font-size:.92rem}
.contact-card .contact-privacy{margin-top:12px;padding-block-start:15px;border-block-start:1px solid #d7def5;font-size:.85rem}
@media(max-width:760px){
  .hero{padding-block:clamp(30px,7vw,56px)}
}

.contact-address { display:flex;justify-content:center;flex-wrap:wrap;align-items:center;min-height:44px;gap:3px 14px;margin-block-start:12px; }
.contact-address .business-email { margin:0;font-weight:650; }
.copy-email{
  min-height:44px;
  padding:5px 10px;
  border-radius:999px;
  font:inherit;
  font-size:.82rem;
  font-weight:690;
  cursor:pointer;
}
.contact-card .copy-feedback { min-height:1.45em;margin:4px 0 0;color:var(--accent);font-size:.8rem; }

@media(max-width:420px) {
  .demo-rows li,.demo-skeleton i { grid-template-columns:1.1rem minmax(0,1fr);min-height:49px; }
  .demo-rows li { font-size:.81rem; }
}
