/* =========================================================
   ZYS — Zerem Yashar Systems
   Apple-inspired design system
   ========================================================= */

@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/inter-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/inter-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/inter-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/inter-latin-700-normal.woff2') format('woff2');}
@font-face{font-family:'Heebo';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/heebo-hebrew-400-normal.woff2') format('woff2');}
@font-face{font-family:'Heebo';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/heebo-hebrew-500-normal.woff2') format('woff2');}
@font-face{font-family:'Heebo';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/heebo-hebrew-600-normal.woff2') format('woff2');}
@font-face{font-family:'Heebo';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/heebo-hebrew-700-normal.woff2') format('woff2');}

:root{
  --ink:#1d1d1f;
  --ink-2:#6e6e73;
  --ink-3:#6e6e73;   /* AA on white and on #f5f5f7 */
  --muted:#6e6e73;
  --line:#d2d2d7;
  --bg:#ffffff;
  --bg-alt:#f5f5f7;
  --bg-dark:#000000;
  --bg-dark-2:#101014;
  --blue:#0071e3;--link:#0064cc;
  --blue-hover:#0077ed;
  --green:#00a862;
  --radius:18px;
  --radius-lg:28px;
  --nav-h:52px;
  --max:1024px;
  --max-wide:1220px;
  --ease:cubic-bezier(.28,.11,.32,1);
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
  font-size:17px;
  line-height:1.47;
  letter-spacing:-.012em;
  color:var(--ink);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
html[dir="rtl"] body{font-family:'Heebo','Inter',-apple-system,Arial,sans-serif;letter-spacing:0;}
img{max-width:100%;display:block;}
a{color:var(--link);text-decoration:none;}
a:hover{text-decoration:underline;}
/* A link sitting inside a run of body text has to be distinguishable without
   relying on color alone (WCAG 1.4.1), so it carries an underline of its own.
   Links that are already obviously links — buttons, cards, nav, footer columns
   — are excluded, because underlining those would change the design. */
p a:not(.btn):not(.go),
.zys-prose li a,
.checks li a{text-decoration:underline;text-underline-offset:2px;}
.footer p a,
.footer-legal-links a,
.crumbs a,
.nav-links a,
.hero p a.btn{text-decoration:none;}
.footer p a:hover,
.crumbs a:hover{text-decoration:underline;}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.02em;line-height:1.07;}
p{margin:0;}
ul{margin:0;padding:0;list-style:none;}

/* ---------- layout ---------- */
.wrap{max-width:var(--max);margin:0 auto;padding:0 22px;}
.wrap-wide{max-width:var(--max-wide);margin:0 auto;padding:0 22px;}
section{position:relative;}
.sec{padding:96px 0;}
.sec-sm{padding:64px 0;}
.sec-alt{background:var(--bg-alt);}
.sec-dark{background:var(--bg-dark);color:#f5f5f7;}
.sec-dark h1,.sec-dark h2,.sec-dark h3{color:#f5f5f7;}
.sec-dark .lead,.sec-dark .muted{color:#a1a1a6;}

/* ---------- type ---------- */
.eyebrow{
  font-size:19px;line-height:1.2;font-weight:600;color:var(--link);
  margin-bottom:10px;letter-spacing:-.01em;
}
.sec-dark .eyebrow{color:#2997ff;}
.display{font-size:clamp(40px,5.6vw,64px);font-weight:600;letter-spacing:-.025em;line-height:1.05;}
.h1{font-size:clamp(34px,4.4vw,52px);font-weight:600;letter-spacing:-.022em;line-height:1.08;}
.h2{font-size:clamp(28px,3.2vw,40px);font-weight:600;letter-spacing:-.02em;line-height:1.1;}
.h3{font-size:22px;font-weight:600;letter-spacing:-.016em;line-height:1.2;}
.lead{font-size:clamp(19px,1.7vw,23px);line-height:1.42;color:var(--ink-2);font-weight:400;letter-spacing:-.01em;}
.muted{color:var(--ink-2);}
.small{font-size:14px;line-height:1.45;color:var(--ink-3);}
.center{text-align:center;}
.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}.mt-32{margin-top:32px}.mt-48{margin-top:48px}.mt-64{margin-top:64px}
.sec-head{max-width:780px;margin:0 auto 56px;text-align:center;}
.sec-head.left{margin-left:0;text-align:start;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border-radius:980px;padding:12px 24px;font-size:17px;font-weight:500;
  background:var(--blue);color:#fff;border:1px solid var(--blue);
  transition:background .2s var(--ease),transform .2s var(--ease);
  white-space:nowrap;cursor:pointer;text-decoration:none;
}
.btn:hover{background:var(--blue-hover);border-color:var(--blue-hover);text-decoration:none;}
.btn-ghost{background:transparent;color:var(--blue);border-color:var(--blue);}
.btn-ghost:hover{background:rgba(0,113,227,.08);}
.sec-dark .btn-ghost{color:#2997ff;border-color:#2997ff;}
.btn-light{background:#fff;color:#000;border-color:#fff;}
.btn-light:hover{background:#e8e8ed;border-color:#e8e8ed;}
.btn-sm{padding:8px 17px;font-size:15px;}
.link{font-size:19px;font-weight:400;color:var(--link);display:inline-flex;align-items:center;gap:4px;}
.sec-dark .link{color:#2997ff;}
.link::after{content:'›';font-size:20px;line-height:1;transform:translateY(-1px);}
html[dir="rtl"] .link::after{content:'‹';}
.btn-row{display:flex;gap:14px;flex-wrap:wrap;}
.btn-row.center{justify-content:center;}
.link-row{display:flex;gap:28px;flex-wrap:wrap;}
.link-row.center{justify-content:center;}

/* ---------- nav ---------- */
.nav{
  position:sticky;top:0;z-index:9000;height:var(--nav-h);
  background:rgba(255,255,255,.72);backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(0,0,0,.08);
}
.nav-inner{max-width:var(--max-wide);margin:0 auto;padding:0 22px;height:100%;display:flex;align-items:center;gap:28px;}
.brand{display:flex;align-items:center;gap:9px;color:var(--ink);font-weight:600;font-size:17px;letter-spacing:-.02em;text-decoration:none;}
.brand:hover{text-decoration:none;}
.brand-mark{width:26px;height:26px;border-radius:7px;background:linear-gradient(145deg,#1d1d1f,#4a4a52);color:#fff;display:grid;place-items:center;font-size:11px;font-weight:700;letter-spacing:0;}
.nav-links{display:flex;align-items:center;gap:26px;margin-inline-start:auto;}
/* A 21px-tall link is a small target with a mouse and a poor one with a
   finger. The header is tall enough that giving every link a 24px box costs
   nothing visually and settles it at every width. */
.nav-links a{
  font-size:14px;font-weight:400;color:var(--ink);letter-spacing:-.01em;opacity:.9;
  display:inline-flex;align-items:center;min-height:24px;
}
.nav-links a:hover{opacity:1;text-decoration:none;color:var(--link);}
.nav-links a.active{font-weight:600;}
.nav-cta{display:flex;align-items:center;gap:12px;}
.lang-btn{
  border:1px solid var(--line);background:transparent;border-radius:980px;
  padding:5px 12px;font-size:13px;font-weight:500;color:var(--ink);cursor:pointer;
  font-family:inherit;transition:background .2s;
}
.lang-btn:hover{background:rgba(0,0,0,.05);}
.nav-toggle{display:none;background:none;border:0;padding:6px;cursor:pointer;}
.nav-toggle span{display:block;width:18px;height:1.5px;background:var(--ink);margin:4px 0;transition:.25s;}

/* ---------- hero ---------- */
.hero{
  background:var(--bg-dark);color:#f5f5f7;text-align:center;
  padding:120px 0 108px;overflow:hidden;position:relative;
}
.hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(760px 380px at 50% -8%,rgba(41,151,255,.30),transparent 62%),
    radial-gradient(620px 340px at 12% 110%,rgba(120,80,255,.18),transparent 62%),
    radial-gradient(620px 340px at 88% 108%,rgba(0,200,150,.14),transparent 62%);
}
.hero .wrap{position:relative;z-index:2;}
.hero h1{color:#f5f5f7;}
.hero .lead{color:#a1a1a6;max-width:660px;margin:20px auto 0;}
.badge{
  display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.06);border-radius:980px;padding:7px 15px;
  font-size:13px;font-weight:500;color:#e8e8ed;margin-bottom:22px;letter-spacing:-.005em;
}
.badge .dot{width:6px;height:6px;border-radius:50%;background:#30d158;}

/* hero device strip */
.hero-strip{display:flex;justify-content:center;gap:14px;margin-top:56px;flex-wrap:wrap;position:relative;z-index:2;}
.hero-chip{
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);
  border-radius:14px;padding:14px 20px;min-width:132px;text-align:center;
}
.hero-chip b{display:block;font-size:15px;font-weight:600;color:#f5f5f7;letter-spacing:-.01em;}
.hero-chip span{display:block;font-size:12px;color:#86868b;margin-top:3px;}

/* ---------- stat band ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;}
.stat b{display:block;font-size:clamp(34px,4vw,46px);font-weight:600;letter-spacing:-.03em;line-height:1;}
.stat span{display:block;font-size:14px;color:var(--ink-2);margin-top:10px;}
.sec-dark .stat span{color:#86868b;}

/* ---------- cards ---------- */
.grid{display:grid;gap:20px;}
.g2{grid-template-columns:repeat(2,1fr);}
.g3{grid-template-columns:repeat(3,1fr);}
.g4{grid-template-columns:repeat(4,1fr);}
.card{
  background:#fff;border-radius:var(--radius);padding:30px 28px;
  border:1px solid rgba(0,0,0,.07);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
  height:100%;
}
.sec-alt .card{border-color:transparent;box-shadow:0 1px 3px rgba(0,0,0,.05);}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.09);}
.card .ico{
  width:44px;height:44px;border-radius:12px;display:grid;place-items:center;
  background:rgba(0,113,227,.10);color:var(--link);margin-bottom:18px;
}
.card .ico svg{width:22px;height:22px;stroke-width:1.6;}
.card h3{margin-bottom:8px;}
.card p{color:var(--ink-2);font-size:16px;line-height:1.5;}
.card-dark{background:var(--bg-dark-2);border-color:rgba(255,255,255,.10);color:#f5f5f7;}
.card-dark p{color:#a1a1a6;}
.card-dark .ico{background:rgba(41,151,255,.16);color:#2997ff;}

/* feature tile (big rounded, apple style) */
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.tile{
  border-radius:var(--radius-lg);padding:48px 42px;background:var(--bg-alt);
  min-height:400px;display:flex;flex-direction:column;
  transition:transform .35s var(--ease);
}
.tile:hover{transform:translateY(-4px);}
.tile.dark{background:var(--bg-dark);color:#f5f5f7;}
.tile.dark h2,.tile.dark h3{color:#f5f5f7;}
.tile.dark p{color:#a1a1a6;}
.tile .tile-foot{margin-top:auto;padding-top:28px;}
.tile p{color:var(--ink-2);font-size:17px;margin-top:12px;}
.tile-blue{background:linear-gradient(160deg,#0a3d7d,#0071e3);color:#fff;}
.tile-blue h2,.tile-blue h3{color:#fff;}
.tile-blue p{color:rgba(255,255,255,.82);}

/* checklist */
.checks li{
  position:relative;padding-inline-start:30px;margin-bottom:13px;
  font-size:16px;line-height:1.5;color:var(--ink-2);
}
.checks li::before{
  content:'';position:absolute;inset-inline-start:0;top:5px;width:18px;height:18px;
  border-radius:50%;background:var(--green);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/13px no-repeat,linear-gradient(#000,#000);
  -webkit-mask-composite:xor;mask-composite:exclude;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/13px no-repeat;
}
.checks li b{color:var(--ink);font-weight:600;}
.sec-dark .checks li b,.tile.dark .checks li b{color:#f5f5f7;}
.sec-dark .checks li,.tile.dark .checks li{color:#a1a1a6;}

/* ---------- marquee ---------- */
.marquee{
  --logo-mark:52px;   /* base height for square symbols */
  --logo-word:25px;   /* base height for wordmarks */
  position:relative;overflow:hidden;padding:14px 0;
  -webkit-mask-image:linear-gradient(90deg,#000 0,#000 88%,transparent);
  mask-image:linear-gradient(90deg,#000 0,#000 88%,transparent);
}
.marquee-track{
  display:flex;width:max-content;align-items:center;
  animation:marquee 46s linear infinite;
  /* held still until the bar scrolls into view, so it is always seen from the
     same full, centred starting frame rather than mid-drift */
  animation-play-state:paused;
}
.marquee.run .marquee-track{animation-play-state:running;}
.marquee.rev .marquee-track{animation-direction:reverse;animation-duration:54s;}
.marquee:hover .marquee-track{animation-play-state:paused;}
@keyframes marquee{from{transform:translate3d(0,0,0);}to{transform:translate3d(-50%,0,0);}}
html[dir="rtl"] .marquee{-webkit-mask-image:linear-gradient(270deg,#000 0,#000 88%,transparent);
  mask-image:linear-gradient(270deg,#000 0,#000 88%,transparent);}
html[dir="rtl"] .marquee-track{animation-direction:reverse;}
html[dir="rtl"] .marquee.rev .marquee-track{animation-direction:normal;}
/* the whole list fits: lay it out as a centred wall, everything readable at once */
.marquee.is-static{-webkit-mask-image:none;mask-image:none;overflow:visible;}
.marquee.is-static .marquee-track{
  animation:none;transform:none;width:100%;
  justify-content:center;flex-wrap:wrap;row-gap:26px;
}
.marquee.is-static .logo-item{padding:0 34px;}
.logo-item{
  flex:0 0 auto;display:grid;place-items:center;
  height:66px;padding:0 46px;opacity:.92;
  transition:opacity .3s var(--ease),transform .3s var(--ease);
}
.logo-item:hover{opacity:1;transform:translateY(-3px);}
.logo-item img{width:auto;object-fit:contain;}
.logo-item img.mark{height:var(--logo-mark);}
.logo-item img.word{height:var(--logo-word);}
.logo-item .logo-fallback{
  font-size:32px;font-weight:600;letter-spacing:-.02em;color:var(--ink);white-space:nowrap;
}
/* symbol + company name, until the official lock-up file is supplied */
.logo-item.lockup{grid-auto-flow:column;gap:12px;align-items:center;}
.logo-item.lockup img.mark{height:42px;}
.lockup-name{
  font-size:27px;font-weight:600;letter-spacing:-.025em;color:#2b2b30;white-space:nowrap;
}
.sec-dark .lockup-name{color:#f5f5f7;}
/* on a dark band, sit each color logo on a light chip so none disappear */
.sec-dark .logo-item{
  background:#fff;border-radius:12px;padding:10px 22px;height:auto;min-height:56px;opacity:.95;
}
.sec-dark .logo-item:hover{opacity:1;}
.sec-dark .logo-item .logo-fallback{color:var(--ink);}
.marquee-label{
  text-align:center;font-size:13px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:26px;
}
.sec-dark .marquee-label{color:#86868b;}

/* ---------- table ---------- */
.table-wrap{overflow-x:auto;border-radius:var(--radius);border:1px solid var(--line);background:#fff;}
table{width:100%;border-collapse:collapse;font-size:16px;min-width:640px;}
th,td{padding:16px 20px;text-align:start;border-bottom:1px solid var(--line);vertical-align:top;}
thead th{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);font-weight:600;background:var(--bg-alt);}
tbody tr:last-child td{border-bottom:0;}
td b{font-weight:600;}
.tick{color:var(--green);font-weight:700;}
.cross{color:var(--ink-3);}

/* ---------- accordion ---------- */
.acc{border-top:1px solid var(--line);}
.acc details{border-bottom:1px solid var(--line);}
.acc summary{
  list-style:none;cursor:pointer;padding:22px 0;font-size:19px;font-weight:500;
  display:flex;align-items:center;justify-content:space-between;gap:16px;letter-spacing:-.015em;
}
.acc summary::-webkit-details-marker{display:none;}
.acc summary::after{content:'+';font-size:26px;font-weight:300;color:var(--ink-2);transition:transform .3s var(--ease);}
.acc details[open] summary::after{transform:rotate(45deg);}
.acc .acc-body{padding:0 0 22px;color:var(--ink-2);font-size:16px;line-height:1.55;max-width:760px;}

/* ---------- calculator ---------- */
.calc{
  background:#fff;border-radius:var(--radius-lg);padding:36px;border:1px solid rgba(0,0,0,.08);
  box-shadow:0 10px 40px rgba(0,0,0,.06);
}
.calc-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px;}
.calc-row label{font-size:15px;font-weight:500;}
.calc-row .val{font-size:15px;font-weight:600;color:var(--link);}
input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:4px;
  background:var(--line);outline:none;margin:6px 0 20px;
}
input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;
  border:1px solid rgba(0,0,0,.12);box-shadow:0 2px 6px rgba(0,0,0,.2);cursor:pointer;
}
.seg{display:flex;background:var(--bg-alt);border-radius:10px;padding:3px;gap:3px;}
.seg button{
  flex:1;border:0;background:transparent;padding:9px 10px;border-radius:8px;font-size:14px;
  font-weight:500;cursor:pointer;font-family:inherit;color:var(--ink-2);transition:.2s;
}
.seg button.on{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.12);}
.calc-out{
  margin-top:26px;padding-top:26px;border-top:1px solid var(--line);
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;text-align:center;
}
.calc-out b{display:block;font-size:27px;font-weight:600;letter-spacing:-.02em;}
.calc-out span{display:block;font-size:13px;color:var(--ink-2);margin-top:5px;}

/* ---------- steps ---------- */
.steps{counter-reset:s;display:grid;gap:0;}
.step{
  position:relative;padding:26px 0 26px 62px;border-bottom:1px solid var(--line);
}
html[dir="rtl"] .step{padding:26px 62px 26px 0;}
.step::before{
  counter-increment:s;content:counter(s);
  position:absolute;inset-inline-start:0;top:24px;width:38px;height:38px;border-radius:50%;
  background:var(--ink);color:#fff;display:grid;place-items:center;font-size:15px;font-weight:600;
}
.step h3{margin-bottom:6px;}
.step p{color:var(--ink-2);font-size:16px;}

/* ---------- quote ---------- */
.quote{max-width:820px;margin:0 auto;text-align:center;}
.quote p{font-size:clamp(23px,2.4vw,30px);line-height:1.32;font-weight:500;letter-spacing:-.02em;}
.quote .who{margin-top:22px;font-size:15px;color:var(--ink-2);}
.sec-dark .quote .who{color:#86868b;}

/* ---------- team / people ---------- */
.person{text-align:center;}
.avatar{
  width:88px;height:88px;border-radius:50%;margin:0 auto 16px;
  background:linear-gradient(150deg,#e8e8ed,#c9c9d1);color:#4a4a52;
  display:grid;place-items:center;font-size:27px;font-weight:600;letter-spacing:-.01em;
}
.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;}
.avatar.has-photo{background:transparent;}
.avatar.a1{background:linear-gradient(150deg,#dbe6ff,#b9c9f5);color:#2c4a8f;}
.avatar.a2{background:linear-gradient(150deg,#d9f2e4,#b3ddc7);color:#1f6647;}
.avatar.a3{background:linear-gradient(150deg,#fdeccd,#f5d9a8);color:#8a6320;}
.avatar.a4{background:linear-gradient(150deg,#fbdcdc,#f2bfbf);color:#8f3b3b;}
.avatar.a5{background:linear-gradient(150deg,#e6dcfb,#cbbdf2);color:#5a3f96;}
.person h3{font-size:18px;}
.person .mail{display:block;margin-top:8px;font-size:14px;color:var(--link);word-break:break-all;}
.person-lead{
  display:flex;align-items:center;gap:28px;text-align:start;
  background:#fff;border-radius:var(--radius);padding:32px 36px;border:1px solid rgba(0,0,0,.07);
}
.person-lead .avatar{width:104px;height:104px;margin:0;flex:0 0 auto;font-size:32px;}
.person-lead h3{font-size:26px;letter-spacing:-.02em;}
.person-row{
  display:flex;align-items:center;gap:18px;text-align:start;
}
.person-row .avatar{width:64px;height:64px;margin:0;flex:0 0 auto;font-size:20px;}
@media(max-width:600px){
  .person-lead{flex-direction:column;text-align:center;gap:18px;}
  .person-lead .avatar{margin:0 auto;}
}
.person .role{font-size:14px;color:var(--ink-2);margin-top:4px;}
.person .cert{
  display:inline-block;margin-top:10px;font-size:11px;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;color:var(--link);background:rgba(0,113,227,.1);
  border-radius:980px;padding:4px 11px;
}

/* ---------- CTA band ---------- */
.cta-band{background:var(--bg-alt);border-radius:var(--radius-lg);padding:64px 48px;text-align:center;}
.cta-band.dark{background:var(--bg-dark);color:#f5f5f7;}
.cta-band.dark h2{color:#f5f5f7;}

/* ---------- form ---------- */
.form{display:grid;gap:16px;}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:7px;color:var(--ink-2);}
.field input,.field select,.field textarea{
  width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:12px;
  font-family:inherit;font-size:16px;color:var(--ink);background:#fff;outline:none;transition:.2s;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--link);box-shadow:0 0 0 3px rgba(0,113,227,.15);}
.field textarea{min-height:120px;resize:vertical;}

/* ---------- footer ---------- */
.footer{background:var(--bg-alt);padding:52px 0 34px;font-size:13px;color:var(--ink-2);}
.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px;padding-bottom:34px;border-bottom:1px solid var(--line);}
.footer h4{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:14px;}
.footer a{color:var(--ink-2);display:block;margin-bottom:9px;}
.footer a:hover{color:var(--ink);text-decoration:underline;}
.footer-bot{padding-top:26px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;}
/* 12px is the floor for legal text. The company number lives on this line. */
.footer-legal{max-width:720px;line-height:1.5;color:var(--ink-3);font-size:12px;}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
.rv.in{opacity:1;transform:none;}
.rv-d1{transition-delay:.08s}.rv-d2{transition-delay:.16s}.rv-d3{transition-delay:.24s}.rv-d4{transition-delay:.32s}

/* ---------- notice bar ---------- */
.ribbon{background:#f5f5f7;text-align:center;font-size:13px;padding:11px 22px;color:var(--ink-2);border-bottom:1px solid rgba(0,0,0,.05);}
.ribbon a{font-weight:500;}

/* ---------- responsive ---------- */
@media(max-width:980px){
  .g4{grid-template-columns:repeat(2,1fr);}
  .tiles{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:1024px){
  body{font-size:16px;}
  .sec{padding:64px 0;}
  .hero{padding:72px 0 64px;}
  .display{font-size:34px;letter-spacing:-.022em;}
  .h1{font-size:29px;}
  .h2{font-size:25px;}
  .lead{font-size:17px;}
  .brand span:last-child{font-size:15px;}
  .g2,.g3,.g4{grid-template-columns:1fr;}
  .stats{grid-template-columns:repeat(2,1fr);gap:32px 18px;}
  .nav-links{display:none;}
  .nav-links.open{
    display:flex;flex-direction:column;align-items:flex-start;gap:2px;
    position:absolute;top:var(--nav-h);inset-inline-start:0;right:0;left:0;
    background:#fff;
    padding:14px 22px 20px;border-bottom:1px solid var(--line);
    max-height:calc(100vh - var(--nav-h));overflow-y:auto;
    box-shadow:0 20px 40px rgba(0,0,0,.16);
  }
  .nav-links.open a{padding:11px 0;font-size:17px;width:100%;border-bottom:1px solid rgba(0,0,0,.05);}
  .nav-toggle{display:block;margin-inline-start:auto;}
  .nav-cta .btn{display:none;}
  .tile{padding:36px 26px;min-height:0;}
  .calc-out{grid-template-columns:1fr;gap:22px;}
  .form .two{grid-template-columns:1fr;}
  .cta-band{padding:44px 24px;}
  .footer-grid{grid-template-columns:1fr;gap:26px;}
  .step{padding-inline-start:52px;}
  .marquee{--logo-mark:40px;--logo-word:20px;}
  .logo-item{padding:0 26px;height:52px;}
  .logo-item .logo-fallback{font-size:25px;}
  .lockup-name{font-size:21px;}
}

/* =========================================================
   Service pages
   ========================================================= */

/* ---------- breadcrumbs ---------- */
.crumbs{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:13px;color:var(--ink-3);padding:16px 0 0;
}
.crumbs a{color:var(--ink-3);}
.crumbs a:hover{color:var(--ink);}
.crumbs .sep{opacity:.5;}
.crumbs .here{color:var(--ink);font-weight:500;}
.sec-dark .crumbs,.svc-hero .crumbs{color:rgba(255,255,255,.5);}
.svc-hero .crumbs a{color:rgba(255,255,255,.5);}
.svc-hero .crumbs a:hover{color:#fff;}
.svc-hero .crumbs .here{color:rgba(255,255,255,.9);}

/* ---------- service hero ---------- */
.svc-hero{
  background:var(--bg-dark);color:#f5f5f7;position:relative;overflow:hidden;
  padding:0 0 88px;
}
.svc-hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(820px 420px at 78% -12%,rgba(41,151,255,.26),transparent 62%),
    radial-gradient(600px 340px at 6% 108%,rgba(120,80,255,.16),transparent 62%);
}
.svc-hero .wrap-wide{position:relative;z-index:2;}
.svc-hero-grid{
  display:grid;grid-template-columns:1.25fr .85fr;gap:56px;align-items:start;
  padding-top:64px;
}
.svc-hero h1{color:#f5f5f7;}
.svc-hero .lead{color:#a1a1a6;margin-top:20px;max-width:34em;}
.svc-hero .eyebrow{color:#2997ff;}
.svc-ico{
  width:52px;height:52px;border-radius:14px;display:grid;place-items:center;
  background:rgba(41,151,255,.16);color:#2997ff;margin-bottom:22px;
}
.svc-ico svg{width:26px;height:26px;stroke-width:1.6;fill:none;stroke:currentColor;
  stroke-linecap:round;stroke-linejoin:round;}

/* facts card */
.facts{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--radius);padding:8px 24px;backdrop-filter:blur(8px);
}
.facts div{
  display:flex;align-items:baseline;justify-content:space-between;gap:18px;
  padding:16px 0;border-bottom:1px solid rgba(255,255,255,.1);
}
.facts div:last-child{border-bottom:0;}
.facts dt,.facts .k{font-size:14px;color:#86868b;}
.facts dd,.facts .v{margin:0;font-size:15px;font-weight:600;color:#f5f5f7;text-align:end;}

/* ---------- service card grid (hub + related) ---------- */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
a.svc-card{
  display:flex;flex-direction:column;gap:10px;height:100%;
  background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:var(--radius);
  padding:28px 26px 24px;color:var(--ink);text-decoration:none;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease);
}
a.svc-card:hover{
  transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.09);
  border-color:rgba(0,113,227,.35);text-decoration:none;
}
.sec-alt a.svc-card{border-color:transparent;box-shadow:0 1px 3px rgba(0,0,0,.05);}
a.svc-card .ico{
  width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  background:rgba(0,113,227,.10);color:var(--link);margin-bottom:8px;
}
a.svc-card .ico svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;}
a.svc-card h3{font-size:19px;letter-spacing:-.017em;}
a.svc-card p{font-size:15px;line-height:1.5;color:var(--ink-2);}
a.svc-card .go{
  margin-top:auto;padding-top:14px;font-size:15px;font-weight:500;color:var(--link);
  display:inline-flex;align-items:center;gap:5px;
}
a.svc-card .go::after{content:'›';font-size:18px;line-height:1;}
html[dir="rtl"] a.svc-card .go::after{content:'‹';}
a.svc-card.dark{background:var(--bg-dark-2);border-color:rgba(255,255,255,.1);color:#f5f5f7;}
a.svc-card.dark p{color:#a1a1a6;}
a.svc-card.dark .ico{background:rgba(41,151,255,.16);color:#2997ff;}
a.svc-card.dark .go{color:#2997ff;}

/* ---------- includes list ---------- */
.includes{columns:2;column-gap:44px;}
.includes li{
  break-inside:avoid;position:relative;padding-inline-start:30px;margin-bottom:14px;
  font-size:16px;line-height:1.5;color:var(--ink-2);
}
.includes li::before{
  content:'';position:absolute;inset-inline-start:0;top:5px;width:18px;height:18px;
  border-radius:50%;background:var(--green);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/13px no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/13px no-repeat;
}

/* ---------- home shortcut strip ---------- */
.shortcut{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
a.shortcut-item{
  display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:14px;
  background:#fff;border:1px solid rgba(0,0,0,.08);color:var(--ink);text-decoration:none;
  transition:border-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);
}
a.shortcut-item:hover{
  border-color:rgba(0,113,227,.4);transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(0,0,0,.07);text-decoration:none;
}
a.shortcut-item .ico{
  width:38px;height:38px;flex:0 0 auto;border-radius:11px;display:grid;place-items:center;
  background:rgba(0,113,227,.10);color:var(--link);
}
a.shortcut-item .ico svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;}
a.shortcut-item b{display:block;font-size:16px;font-weight:600;letter-spacing:-.015em;}
a.shortcut-item span{display:block;font-size:13px;color:var(--ink-2);margin-top:2px;line-height:1.35;}

@media(max-width:980px){
  .svc-hero-grid{grid-template-columns:1fr;gap:36px;padding-top:44px;}
  .svc-grid{grid-template-columns:repeat(2,1fr);}
  .shortcut{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:1024px){
  .svc-hero{padding-bottom:56px;}
  .svc-grid{grid-template-columns:1fr;}
  .shortcut{grid-template-columns:1fr;}
  .includes{columns:1;}
}

/* practice-lead card under the hero facts */
a.ask{
  display:flex;align-items:center;gap:14px;margin-top:16px;padding:14px 18px;
  border-radius:var(--radius);border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);color:#f5f5f7;text-decoration:none;
  transition:background .25s var(--ease),border-color .25s var(--ease);
}
a.ask:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.24);text-decoration:none;}
a.ask .avatar{width:46px;height:46px;margin:0;flex:0 0 auto;font-size:15px;}
a.ask b{display:block;font-size:15px;font-weight:600;letter-spacing:-.012em;}
a.ask > span > span{display:block;font-size:13px;color:#86868b;margin-top:2px;line-height:1.35;}

/* hero closing line */
.hero-tag{
  margin:18px auto 0;max-width:620px;
  font-size:clamp(16px,1.35vw,18px);line-height:1.45;font-weight:500;
  color:#f5f5f7;letter-spacing:-.01em;
}

/* =========================================================
   "Apple for Business" nav dropdown
   ========================================================= */
.nav-item{position:relative;display:inline-flex;align-items:center;}
.nav-item.has-menu > a::after{
  content:'';width:6px;height:6px;margin-inline-start:7px;flex:0 0 auto;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:translateY(-2px) rotate(45deg);opacity:.5;transition:transform .25s var(--ease),opacity .25s;
}
.nav-item.has-menu > a{display:inline-flex;align-items:center;}
.nav-item.has-menu.open > a::after{transform:translateY(0) rotate(-135deg);opacity:1;}
.nav-item.has-menu.open > a{color:var(--link);opacity:1;}

.nav-menu{
  position:absolute;top:calc(100% + 14px);inset-inline-start:50%;
  transform:translateX(-50%) translateY(-6px);
  width:min(720px,calc(100vw - 40px));
  background:#fff;
  border:1px solid rgba(0,0,0,.07);border-radius:20px;
  box-shadow:0 30px 70px rgba(0,0,0,.22),0 2px 8px rgba(0,0,0,.08);
  padding:12px;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .22s var(--ease),transform .22s var(--ease),visibility .22s;
  z-index:9200;
}
html[dir="rtl"] .nav-menu{transform:translateX(50%) translateY(-6px);}
.nav-item.has-menu.open .nav-menu{
  opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);
}
html[dir="rtl"] .nav-item.has-menu.open .nav-menu{transform:translateX(50%) translateY(0);}
/* keeps the pointer from falling through the gap between link and panel */
.nav-menu::before{content:'';position:absolute;inset-inline:0;top:-16px;height:16px;}

.nav-menu-inner{display:grid;grid-template-columns:1fr 1fr;gap:2px;}
a.nav-menu-item{
  display:flex;align-items:flex-start;gap:11px;padding:10px 12px;border-radius:13px;
  color:var(--ink);text-decoration:none;transition:background .18s var(--ease);
}
a.nav-menu-item:hover{background:rgba(0,0,0,.05);text-decoration:none;}
a.nav-menu-item .ico{
  width:34px;height:34px;flex:0 0 auto;border-radius:10px;display:grid;place-items:center;
  background:rgba(0,113,227,.10);color:var(--link);
}
a.nav-menu-item .ico svg{width:17px;height:17px;stroke-width:1.6;}
a.nav-menu-item .txt{display:block;min-width:0;}
a.nav-menu-item b{display:block;font-size:14px;font-weight:600;letter-spacing:-.012em;}
a.nav-menu-item .txt span{
  display:block;font-size:12.5px;line-height:1.4;color:var(--ink-2);margin-top:2px;
}
a.nav-menu-all{
  display:block;margin-top:6px;padding:11px;border-radius:13px;text-align:center;
  font-size:14px;font-weight:600;color:var(--link);background:rgba(0,113,227,.07);
}
a.nav-menu-all:hover{background:rgba(0,113,227,.13);text-decoration:none;}

@media(max-width:980px){
  .nav-menu{width:min(560px,calc(100vw - 32px));}
  .nav-menu-inner{grid-template-columns:1fr;}
  a.nav-menu-item .txt span{display:none;}
}


@media(max-width:1024px){
  /* inside the mobile menu the panel simply sits open, indented */
  .nav-item{display:block;width:100%;}
  .nav-item.has-menu > a::after{display:none;}
  .nav-menu{
    position:static;transform:none;width:auto;opacity:1;visibility:visible;pointer-events:auto;
    background:transparent;border:0;box-shadow:none;backdrop-filter:none;
    -webkit-backdrop-filter:none;padding:2px 0 8px;
  }
  html[dir="rtl"] .nav-menu{transform:none;}
  .nav-menu::before{display:none;}
  a.nav-menu-item{padding:9px 0 9px 14px;border-radius:0;}
  html[dir="rtl"] a.nav-menu-item{padding:9px 14px 9px 0;}
  a.nav-menu-item .ico{width:28px;height:28px;}
  a.nav-menu-item b{font-size:15px;}
  a.nav-menu-all{margin-top:4px;padding:9px 14px;text-align:start;background:transparent;}
}

/* =========================================================
   Floating contact dock
   Fixed to the trailing edge, so it sits bottom-right in
   English and bottom-left in Hebrew with no extra rules.
   ========================================================= */
.zys-dock{
  position:fixed; inset-inline-end:22px; bottom:22px; z-index:9000;
  display:flex; flex-direction:column; gap:10px; align-items:flex-end;
}
html[dir="rtl"] .zys-dock{align-items:flex-start;}

.zys-dock-btn{
  display:flex; align-items:center; gap:0;
  height:52px; padding:0 14px; border-radius:980px;
  background:#fff; color:var(--ink); text-decoration:none;
  border:1px solid rgba(0,0,0,.07);
  box-shadow:0 6px 20px rgba(0,0,0,.14);
  transition:gap .28s var(--ease), padding .28s var(--ease),
             transform .22s var(--ease), box-shadow .22s var(--ease);
}
.zys-dock-btn svg{width:24px; height:24px; flex:0 0 auto;}
.zys-dock-btn.wa{background:#25d366; color:#fff; border-color:transparent;}
.zys-dock-btn.mail{background:var(--blue); color:#fff; border-color:transparent;}

/* The label unfurls on hover rather than sitting there permanently, so the
   dock reads as part of the site instead of a bolted-on widget. */
.zys-dock-label{
  max-width:0; overflow:hidden; white-space:nowrap;
  font-size:14px; font-weight:600; letter-spacing:-.01em;
  transition:max-width .28s var(--ease);
}
.zys-dock-btn:hover,
.zys-dock-btn:focus-visible{
  gap:9px; transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(0,0,0,.2); text-decoration:none;
}
.zys-dock-btn:hover .zys-dock-label,
.zys-dock-btn:focus-visible .zys-dock-label{max-width:140px;}
.zys-dock-btn:focus-visible{outline:2px solid var(--ink); outline-offset:3px;}

/* Out of the way of the mobile menu, and never on top of a cookie banner. */
body.nav-open .zys-dock{opacity:0; pointer-events:none;}
.zys-dock{transition:opacity .2s var(--ease);}

@media (max-width:760px){
  .zys-dock{inset-inline-end:14px; bottom:14px; gap:8px;}
  .zys-dock-btn{height:46px; padding:0 11px;}
  .zys-dock-btn svg{width:22px; height:22px;}
  /* Keep the dock off the send button on a phone. */
  .form .btn-row{margin-bottom:74px;}
}
@media (prefers-reduced-motion:reduce){
  .zys-dock-btn,.zys-dock-label{transition:none;}
  .zys-dock-btn:hover{transform:none;}
}
/* The social group: the three profiles stack above the button that opens
   them, and inherit every dock-button rule, so they line up with WhatsApp and
   Email instead of looking bolted on. */
.zys-dock-social{display:flex; flex-direction:column; gap:10px; align-items:inherit;}
.zys-dock-social-list{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:10px; align-items:inherit;
}
.zys-dock-social-list li{margin:0;}
.zys-dock-btn.social-toggle{cursor:pointer; font:inherit;}
.zys-dock-btn.facebook{background:#1877f2; color:#fff; border-color:transparent;}
.zys-dock-btn.instagram{
  background:radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
  color:#fff; border-color:transparent;
}
.zys-dock-btn.linkedin{background:#0a66c2; color:#fff; border-color:transparent;}

/* Footer row. Same glyphs, sized for a line of text rather than a dock. */
.footer-social{
  list-style:none; margin:16px 0 0; padding:0;
  display:flex; gap:10px; align-items:center;
}
.footer-social li{margin:0;}
.footer-social-link{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:980px;
  border:1px solid rgba(255,255,255,.18);
  color:inherit; text-decoration:none;
  transition:background .2s var(--ease), border-color .2s var(--ease),
             transform .2s var(--ease);
}
.footer-social-link svg{width:19px; height:19px;}
.footer-social-link:hover,
.footer-social-link:focus-visible{
  background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.34);
  transform:translateY(-1px); text-decoration:none;
}
.footer-social-link:focus-visible{outline:2px solid currentColor; outline-offset:3px;}
@media (prefers-reduced-motion:reduce){
  .footer-social-link{transition:none;}
  .footer-social-link:hover{transform:none;}
}
/* =========================================================
   Touch targets and small text
   Measured, not guessed: at 375px the footer column links were
   19px tall, the breadcrumb links 19px, the legal row 20px and
   the contact-card addresses 20px. WCAG 2.2 asks for 24x24, and
   a 19px target is a real miss on a phone whatever the standard
   says.

   Applied at every width rather than only on touch. The first
   version was scoped to coarse pointers, and then an iPad in
   landscape — 1024px, unmistakably touched — reported a fine
   pointer and got nothing. A comfortable target costs a mouse
   user nothing, so the condition is gone: padding grows the hit
   area without moving the text, and the layout keeps its rhythm.

   Links inside a sentence are left alone on purpose — the
   Privacy Policy link in the form note, the ribbon link. Their
   height is set by the line they sit in, which is the exception
   SC 2.5.8 makes, and padding there would break the paragraph.
   ========================================================= */
.footer-grid a,
.footer-grid p.small a,
.footer-legal-links a,
.footer-legal-links button,
.crumbs a,
.checks li a{
  display:inline-flex; align-items:center; min-height:24px;
}
.footer-grid > div > a{display:flex;}
/* A slider whose track is 4px tall is a 4px target. The track keeps its look;
   the control gets a height a finger can find. */
input[type="range"]{min-height:24px;}

@media (pointer: coarse), (max-width: 1024px){
  /* Small print never below 12px on a phone — 11px legal text is a squint. */
  .brand-mark{font-size:12px;}
  .small{font-size:max(12px, .82rem);}
}


@media print{ .footer-social{display:none;} }

@media print{ .zys-dock{display:none;} }

/* =========================================================
   Accessibility
   ========================================================= */

/* Skip link — off screen until it takes focus, then unmissable. */
.skip-link{
  position:absolute; inset-inline-start:16px; top:-100px; z-index:10000;
  background:var(--ink); color:#fff; padding:12px 18px; border-radius:10px;
  font-weight:600; font-size:15px; text-decoration:none;
  transition:top .18s var(--ease);
}
.skip-link:focus{top:16px; color:#fff; text-decoration:none;}
#main:focus{outline:none;}

/* One visible focus style for everything that takes keyboard focus. Uses two
   rings so it stays visible on both the light and the black sections. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
details:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid var(--blue);
  outline-offset:2px;
  border-radius:4px;
}
.sec-dark a:focus-visible,
.sec-dark button:focus-visible,
.hero a:focus-visible,
.hero button:focus-visible,
.cta-band.dark a:focus-visible,
.footer a:focus-visible,
.ribbon a:focus-visible,
.svc-hero a:focus-visible{
  outline-color:#fff;
  box-shadow:0 0 0 6px rgba(0,0,0,.55);
}

/* Screen-reader-only text that still reaches assistive technology. */
.zys-sr{
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}

/* Pause control for the moving logo bars — WCAG 2.2.2 requires a way to stop
   motion that runs for more than five seconds. */
.marquee-pause{
  display:block; margin:10px auto 0; padding:5px 14px;
  font:inherit; font-size:12.5px; font-weight:600; letter-spacing:-.01em;
  background:transparent; color:var(--muted);
  border:1px solid var(--line); border-radius:980px; cursor:pointer;
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.marquee-pause:hover{color:var(--ink); border-color:var(--line-2, #c8d0d9);}

/* Reduced motion: nothing moves, nothing fades in, and revealed content is
   simply present. */
@media (prefers-reduced-motion: reduce){
  .marquee-track{animation:none!important; transform:none!important;}
  .rv,.rv.in{opacity:1!important; transform:none!important; transition:none!important;}
  .skip-link{transition:none;}
  *{scroll-behavior:auto!important;}
}

/* If JavaScript never runs, the reveal animation must not leave the page
   blank. The class is removed by script on load; without script this wins. */
html.no-js .rv{opacity:1; transform:none;}

/* Form validation messages. */
.field-error{
  display:block; margin-top:6px; font-size:13px; font-weight:600; color:#b3261e;
}
.field input[aria-invalid="true"],
.field select[aria-invalid="true"],
.field textarea[aria-invalid="true"]{
  border-color:#b3261e; box-shadow:0 0 0 3px rgba(179,38,30,.12);
}
.form-status{margin-top:14px;}

/* Legal links row in the footer */
.footer-legal-links{
  display:flex; flex-wrap:wrap; gap:8px 22px; align-items:center;
  padding:22px 0 0; margin-top:26px; border-top:1px solid rgba(0,0,0,.07);
}
.footer-legal-links a,
.footer-cc-btn{
  font-size:13.5px; color:var(--muted); text-decoration:none;
  background:none; border:0; padding:0; cursor:pointer; font:inherit; font-size:13.5px;
}
.footer-legal-links a:hover,.footer-cc-btn:hover{color:var(--ink); text-decoration:underline;}

/* Legal document pages */
.zys-legal{max-width:760px; padding:110px 0 90px;}
.zys-legal h1{margin-bottom:26px;}
.zys-legal h2{margin:34px 0 10px;}
.zys-legal p{margin:0 0 12px; line-height:1.7;}
.zys-legal ul.checks{margin:8px 0 18px;}
.zys-legal .muted{font-size:14px;}
[data-lang][hidden]{display:none!important;}

/* Cookie consent */
.zys-cc{
  position:fixed; inset-inline-start:0; inset-inline-end:0; bottom:0; z-index:9600;
  background:#fff; border-top:1px solid var(--line);
  box-shadow:0 -8px 30px rgba(0,0,0,.13);
}
.zys-cc-inner{max-width:900px; margin:0 auto; padding:22px 24px 24px;}
.zys-cc-title{font-size:18px; font-weight:600; letter-spacing:-.01em; margin:0 0 8px;}
.zys-cc-body{font-size:14.5px; color:var(--muted); margin:0 0 10px; max-width:70ch; line-height:1.6;}
.zys-cc-cats{display:grid; gap:12px; margin:16px 0 6px;}
.zys-cc-cat{display:flex; gap:11px; align-items:flex-start; font-size:14px;}
.zys-cc-cat input{margin-top:3px; width:17px; height:17px; flex:0 0 auto;}
.zys-cc-cat b{display:block; font-weight:600;}
.zys-cc-cat span span{color:var(--muted); font-size:13.5px;}
.zys-cc-btns{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:16px;}
.zys-cc-link{background:none; border:0; padding:6px 2px; font:inherit; font-size:14px;
  color:var(--link); cursor:pointer; text-decoration:underline;}
/* Keep the floating buttons clear of the banner while it is open. */
body:has(#zys-cc:not([hidden])) .zys-dock{bottom:calc(22px + 190px);}
@media(max-width:1024px){
  .zys-cc-inner{padding:18px 16px 20px;}
  .zys-cc-btns .btn{flex:1 1 auto;}
  body:has(#zys-cc:not([hidden])) .zys-dock{display:none;}
}

/* =========================================================
   Accessibility toolbar
   Sits on the leading edge so it can never collide with the
   WhatsApp / email dock, which sits on the trailing edge.
   ========================================================= */
.zys-a11y{position:fixed; inset-inline-start:22px; bottom:22px; z-index:9400;}
.zys-a11y-btn{
  width:52px; height:52px; border-radius:50%; border:1px solid rgba(0,0,0,.07);
  background:var(--blue); color:#fff; cursor:pointer; padding:0;
  display:grid; place-items:center; box-shadow:0 6px 20px rgba(0,0,0,.16);
  transition:transform .22s var(--ease), box-shadow .22s var(--ease);
}
.zys-a11y-btn svg{width:30px; height:30px;}
.zys-a11y-btn:hover{transform:translateY(-2px); box-shadow:0 10px 26px rgba(0,0,0,.22);}

.zys-a11y-panel{
  position:absolute; bottom:64px; inset-inline-start:0; width:310px; max-width:calc(100vw - 32px);
  background:#fff; color:var(--ink); border:1px solid var(--line); border-radius:16px;
  box-shadow:0 18px 50px rgba(0,0,0,.20); padding:16px; text-align:start;
}
.zys-a11y-head{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px;}
.zys-a11y-head h2{font-size:16px; font-weight:600; margin:0; letter-spacing:-.01em;}
.zys-a11y-close{background:none; border:0; padding:5px; cursor:pointer; color:var(--ink-3); border-radius:8px;}
.zys-a11y-close svg{width:18px; height:18px; display:block;}
.zys-a11y-close:hover{color:var(--ink);}

.zys-a11y-size-label{font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-3); margin:0 0 7px;}
.zys-a11y-size{display:flex; align-items:center; gap:8px; margin-bottom:14px;}
.zys-a11y-size button{
  flex:0 0 auto; width:46px; height:38px; border-radius:10px; cursor:pointer;
  border:1px solid var(--line); background:var(--bg-alt,#f5f5f7); color:var(--ink);
  font-weight:600; font-size:15px; display:grid; place-items:center; grid-auto-flow:column; gap:1px;
}
.zys-a11y-size button span{font-size:12px;}
.zys-a11y-size button:hover{border-color:var(--ink-3);}
.zys-a11y-scale{flex:1; text-align:center; font-size:14px; font-weight:600;
  font-variant-numeric:tabular-nums; color:var(--ink-3);}

.zys-a11y-opts{display:grid; gap:5px;}
.zys-a11y-opt{
  display:flex; align-items:center; gap:11px; width:100%; padding:9px 11px;
  border:1px solid transparent; border-radius:11px; background:none; cursor:pointer;
  font:inherit; font-size:14.5px; color:var(--ink); text-align:start;
}
.zys-a11y-opt:hover{background:var(--bg-alt,#f5f5f7);}
.zys-a11y-ico{width:22px; height:22px; flex:0 0 auto; color:var(--ink-3); display:block;}
.zys-a11y-ico svg{width:22px; height:22px; display:block;}
.zys-a11y-opt[aria-pressed="true"]{background:var(--accent-soft,#e8f1fd); border-color:var(--link);
  color:var(--link); font-weight:600;}
.zys-a11y-opt[aria-pressed="true"] .zys-a11y-ico{color:var(--link);}
/* State is never carried by color alone. */
.zys-a11y-opt[aria-pressed="true"]::after{content:"\2713"; margin-inline-start:auto; font-weight:700;}

.zys-a11y-foot{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:8px; margin-top:13px; padding-top:12px; border-top:1px solid var(--line);}
.zys-a11y-reset{background:none; border:0; padding:4px 0; cursor:pointer; font:inherit;
  font-size:13.5px; font-weight:600; color:var(--ink); text-decoration:underline;}
.zys-a11y-foot a{font-size:13.5px;}

@media(max-width:1024px){
  .zys-a11y{inset-inline-start:14px; bottom:14px;}
  .zys-a11y-btn{width:46px; height:46px;}
  .zys-a11y-btn svg{width:26px; height:26px;}
  .zys-a11y-panel{width:min(310px, calc(100vw - 28px));}
}

/* ---------- what the options actually do ---------- */

html[data-a11y-contrast]{--ink:#000; --ink-2:#000; --ink-3:#1a1a1a; --muted:#1a1a1a;
  --link:#00379e; --line:#000; --bg:#fff; --bg-alt:#fff;}
html[data-a11y-contrast] body{background:#fff; color:#000;}
html[data-a11y-contrast] .sec,html[data-a11y-contrast] .sec-alt,html[data-a11y-contrast] .sec-sm,
html[data-a11y-contrast] .card,html[data-a11y-contrast] .footer{background:#fff; color:#000;}
html[data-a11y-contrast] .hero,html[data-a11y-contrast] .sec-dark,html[data-a11y-contrast] .svc-hero,
html[data-a11y-contrast] .cta-band.dark,html[data-a11y-contrast] .card-dark{background:#000; color:#fff;}
html[data-a11y-contrast] .hero *,html[data-a11y-contrast] .sec-dark *,html[data-a11y-contrast] .svc-hero *,
html[data-a11y-contrast] .cta-band.dark *,html[data-a11y-contrast] .card-dark *{color:#fff; border-color:#fff;}
html[data-a11y-contrast] .hero a,html[data-a11y-contrast] .sec-dark a,
html[data-a11y-contrast] .svc-hero a,html[data-a11y-contrast] .cta-band.dark a{color:#ffe066;}
html[data-a11y-contrast] a{color:#00379e;}
html[data-a11y-contrast] .btn{border:2px solid currentColor;}
html[data-a11y-contrast] .card,html[data-a11y-contrast] .field input,
html[data-a11y-contrast] .field select,html[data-a11y-contrast] .field textarea{border:2px solid #000;}

html[data-a11y-grayscale]{filter:grayscale(1);}

html[data-a11y-links] a{text-decoration:underline !important; text-underline-offset:3px;
  outline:1px solid currentColor; outline-offset:2px; border-radius:2px;}
html[data-a11y-links] .btn{outline:2px solid currentColor; outline-offset:3px;}

html[data-a11y-motion] *,html[data-a11y-motion] *::before,html[data-a11y-motion] *::after{
  animation:none !important; transition:none !important; scroll-behavior:auto !important;}
html[data-a11y-motion] .rv,html[data-a11y-motion] .rv.in{opacity:1 !important; transform:none !important;}
html[data-a11y-motion] .marquee-track{animation:none !important; transform:none !important;}

html[data-a11y-readable],html[data-a11y-readable] body,
html[data-a11y-readable] h1,html[data-a11y-readable] h2,html[data-a11y-readable] h3,
html[data-a11y-readable] .display,html[data-a11y-readable] .h1,html[data-a11y-readable] .h2,
html[data-a11y-readable] .h3,html[data-a11y-readable] .btn,html[data-a11y-readable] input,
html[data-a11y-readable] select,html[data-a11y-readable] textarea{
  font-family:Verdana,Tahoma,"DejaVu Sans",Arial,sans-serif !important;
  letter-spacing:normal !important;}
html[data-a11y-readable] p,html[data-a11y-readable] li,html[data-a11y-readable] .lead{
  line-height:1.85 !important; text-align:start !important;}

html[data-a11y-spacing] p,html[data-a11y-spacing] li,html[data-a11y-spacing] .lead,
html[data-a11y-spacing] .small,html[data-a11y-spacing] td,html[data-a11y-spacing] .field label{
  line-height:2 !important; letter-spacing:.045em !important; word-spacing:.14em !important;}
html[data-a11y-spacing] p,html[data-a11y-spacing] li{margin-bottom:1.1em !important;}

@media print{ .zys-a11y{display:none;} }

/* ===== ZYS text scaling — generated, do not edit by hand =====
   Every type size in this file, restated as a multiple of --a11y-text.
   Untouched at the default scale of 1. ===== */
html[data-a11y-text] body{font-size:calc(17px * var(--a11y-text,1));}
html[data-a11y-text] .eyebrow{font-size:calc(19px * var(--a11y-text,1));}
html[data-a11y-text] .display{font-size:calc(clamp(40px,5.6vw,64px) * var(--a11y-text,1));}
html[data-a11y-text] .h1{font-size:calc(clamp(34px,4.4vw,52px) * var(--a11y-text,1));}
html[data-a11y-text] .h2{font-size:calc(clamp(28px,3.2vw,40px) * var(--a11y-text,1));}
html[data-a11y-text] .h3{font-size:calc(22px * var(--a11y-text,1));}
html[data-a11y-text] .lead{font-size:calc(clamp(19px,1.7vw,23px) * var(--a11y-text,1));}
html[data-a11y-text] .small{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] .btn{font-size:calc(17px * var(--a11y-text,1));}
html[data-a11y-text] .btn-sm{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] .link{font-size:calc(19px * var(--a11y-text,1));}
html[data-a11y-text] .link::after{font-size:calc(20px * var(--a11y-text,1));}
html[data-a11y-text] .brand{font-size:calc(17px * var(--a11y-text,1));}
html[data-a11y-text] .brand-mark{font-size:calc(11px * var(--a11y-text,1));}
html[data-a11y-text] .nav-links a{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] .lang-btn{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] .badge{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] .hero-chip b{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] .hero-chip span{font-size:calc(12px * var(--a11y-text,1));}
html[data-a11y-text] .stat b{font-size:calc(clamp(34px,4vw,46px) * var(--a11y-text,1));}
html[data-a11y-text] .stat span{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] .card p{font-size:calc(16px * var(--a11y-text,1));}
html[data-a11y-text] .tile p{font-size:calc(17px * var(--a11y-text,1));}
html[data-a11y-text] .checks li{font-size:calc(16px * var(--a11y-text,1));}
html[data-a11y-text] .logo-item .logo-fallback{font-size:calc(32px * var(--a11y-text,1));}
html[data-a11y-text] .lockup-name{font-size:calc(27px * var(--a11y-text,1));}
html[data-a11y-text] .marquee-label{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] table{font-size:calc(16px * var(--a11y-text,1));}
html[data-a11y-text] thead th{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] .acc summary{font-size:calc(19px * var(--a11y-text,1));}
html[data-a11y-text] .acc summary::after{font-size:calc(26px * var(--a11y-text,1));}
html[data-a11y-text] .acc .acc-body{font-size:calc(16px * var(--a11y-text,1));}
html[data-a11y-text] .calc-row label{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] .calc-row .val{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] .seg button{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] .calc-out b{font-size:calc(27px * var(--a11y-text,1));}
html[data-a11y-text] .calc-out span{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] .step::before{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] .step p{font-size:calc(16px * var(--a11y-text,1));}
html[data-a11y-text] .quote p{font-size:calc(clamp(23px,2.4vw,30px) * var(--a11y-text,1));}
html[data-a11y-text] .quote .who{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] .avatar{font-size:calc(27px * var(--a11y-text,1));}
html[data-a11y-text] .person h3{font-size:calc(18px * var(--a11y-text,1));}
html[data-a11y-text] .person .mail{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] .person-lead .avatar{font-size:calc(32px * var(--a11y-text,1));}
html[data-a11y-text] .person-lead h3{font-size:calc(26px * var(--a11y-text,1));}
html[data-a11y-text] .person-row .avatar{font-size:calc(20px * var(--a11y-text,1));}
html[data-a11y-text] .person .role{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] .person .cert{font-size:calc(11px * var(--a11y-text,1));}
html[data-a11y-text] .field label{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] .field input,html[data-a11y-text] .field select,html[data-a11y-text] .field textarea{font-size:calc(16px * var(--a11y-text,1));}
html[data-a11y-text] .footer{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] .footer h4{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] .footer-legal{font-size:calc(12px * var(--a11y-text,1));}
html[data-a11y-text] .ribbon{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] .crumbs{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] .facts dt,html[data-a11y-text] .facts .k{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] .facts dd,html[data-a11y-text] .facts .v{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] a.svc-card h3{font-size:calc(19px * var(--a11y-text,1));}
html[data-a11y-text] a.svc-card p{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] a.svc-card .go{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] a.svc-card .go::after{font-size:calc(18px * var(--a11y-text,1));}
html[data-a11y-text] .includes li{font-size:calc(16px * var(--a11y-text,1));}
html[data-a11y-text] a.shortcut-item b{font-size:calc(16px * var(--a11y-text,1));}
html[data-a11y-text] a.shortcut-item span{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] a.ask .avatar{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] a.ask b{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] a.ask > span > span{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] .hero-tag{font-size:calc(clamp(16px,1.35vw,18px) * var(--a11y-text,1));}
html[data-a11y-text] a.nav-menu-item b{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] a.nav-menu-item .txt span{font-size:calc(12.5px * var(--a11y-text,1));}
html[data-a11y-text] a.nav-menu-all{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] .zys-dock-label{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] .skip-link{font-size:calc(15px * var(--a11y-text,1));}
html[data-a11y-text] .marquee-pause{font-size:calc(12.5px * var(--a11y-text,1));}
html[data-a11y-text] .field-error{font-size:calc(13px * var(--a11y-text,1));}
html[data-a11y-text] .footer-legal-links a,html[data-a11y-text] .footer-cc-btn{font-size:calc(13.5px * var(--a11y-text,1));}
html[data-a11y-text] .zys-legal .muted{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] .zys-cc-title{font-size:calc(18px * var(--a11y-text,1));}
html[data-a11y-text] .zys-cc-body{font-size:calc(14.5px * var(--a11y-text,1));}
html[data-a11y-text] .zys-cc-cat{font-size:calc(14px * var(--a11y-text,1));}
html[data-a11y-text] .zys-cc-cat span span{font-size:calc(13.5px * var(--a11y-text,1));}
html[data-a11y-text] .zys-cc-link{font-size:calc(14px * var(--a11y-text,1));}
@media(max-width:1024px){
  html[data-a11y-text] body{font-size:calc(16px * var(--a11y-text,1));}
  html[data-a11y-text] .display{font-size:calc(34px * var(--a11y-text,1));}
  html[data-a11y-text] .h1{font-size:calc(29px * var(--a11y-text,1));}
  html[data-a11y-text] .h2{font-size:calc(25px * var(--a11y-text,1));}
  html[data-a11y-text] .lead{font-size:calc(17px * var(--a11y-text,1));}
  html[data-a11y-text] .brand span:last-child{font-size:calc(15px * var(--a11y-text,1));}
  html[data-a11y-text] .nav-links.open a{font-size:calc(17px * var(--a11y-text,1));}
  html[data-a11y-text] .logo-item .logo-fallback{font-size:calc(25px * var(--a11y-text,1));}
  html[data-a11y-text] .lockup-name{font-size:calc(21px * var(--a11y-text,1));}
  html[data-a11y-text] a.nav-menu-item b{font-size:calc(15px * var(--a11y-text,1));}
}


/* ---------- enquiry form: response commitment and success state ----------
   Both are quiet by design. A response commitment stated as a fact reads as a
   commitment; the same words in a flashing badge read as a sales tactic, and
   an enterprise buyer discounts them accordingly. */
.sla-note{
  display:flex;flex-direction:column;gap:2px;
  padding:12px 14px;border:1px solid var(--line);border-radius:8px;
  background:var(--bg-alt);font-size:14px;color:var(--ink);
}
.sla-note .sla-hours{font-size:13px;color:var(--ink-2);}
.form-done{display:none;}
.form-done.is-ok,.form-done.is-error{
  display:flex;flex-direction:column;gap:6px;
  margin-top:16px;padding:16px 18px;border-radius:10px;font-weight:400;
}
.form-done.is-ok{background:rgba(28,138,86,.08);border:1px solid rgba(28,138,86,.28);}
.form-done.is-error{background:rgba(179,45,46,.07);border:1px solid rgba(179,45,46,.3);color:#8f2323;}
.form-done b{font-size:16px;font-weight:600;color:var(--ink);}
.form-done .form-ref{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:14px;letter-spacing:.01em;color:var(--ink);
}
.form-done .form-detail{font-size:14px;color:var(--ink-2);}
.form-done:focus{outline:2px solid var(--link);outline-offset:3px;}