/* ============================================================
   greenAI — site.css
   Dark ground, in the spirit of the landing page.
   Tokens are the landing page's tokens; no hard-coded one-offs.
   ============================================================ */

:root{
  --bg:#060b08;
  --ink:#f0f5f2;
  --muted:#9aada3;
  /* --faint is decorative only (·, dividers). Readable small text uses --faint-txt. */
  --faint:#5d6d65;
  --faint-txt:#7a8a82;
  --green:#2a9d5c;
  --green-lite:#4ade80;
  --hairline:rgba(240,245,242,.11);
  --hairline-soft:rgba(240,245,242,.07);
  --card-bg:rgba(255,255,255,.03);
  --card-bg-2:rgba(255,255,255,.02);
  --ease:cubic-bezier(.16,1,.3,1);
  --wrap:1120px;
  --hdr-h:64px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

html{
  -webkit-text-size-adjust:100%;
  overflow-x:hidden;overflow-x:clip;
  max-width:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--hdr-h) + 16px);
}

body{
  font-family:"Heebo","Assistant","Rubik",-apple-system,BlinkMacSystemFont,"Segoe UI","Arial Hebrew",Arial,sans-serif;
  background:var(--bg);
  color:var(--ink);
  font-size:17px;
  font-weight:400;
  line-height:1.65;
  font-variant-numeric:tabular-nums;
  min-height:100svh;
  overflow-x:hidden;overflow-x:clip;
  max-width:100%;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-synthesis-weight:none;
  text-rendering:optimizeLegibility;
}

/* ---------- the one graphic element: a single light source ---------- */
.light{
  position:fixed;z-index:0;pointer-events:none;
  top:-36vh;left:50%;
  width:min(1180px,150vw);height:78vh;
  transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(42,157,92,.30),rgba(42,157,92,.10) 55%,transparent 78%);
  filter:blur(28px);
  will-change:transform,opacity;
  animation:breathe 26s var(--ease) infinite;
}
@keyframes breathe{
  0%,100%{transform:translateX(-50%) scale(1);opacity:.9}
  50%{transform:translateX(-50%) scale(1.07);opacity:1}
}

/* vignette: settles the light into the page (decorative) */
body::after{
  content:"";position:fixed;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(125% 95% at 50% 22%,transparent 42%,rgba(0,0,0,.58) 100%);
}
/* fine grain: keeps the flat dark from looking digital (decorative) */
body::before{
  content:"";position:fixed;inset:-100%;z-index:1;pointer-events:none;
  opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* content always sits above the decoration */
main{position:relative;z-index:2}
.hdr{position:sticky;z-index:60}
.ftr{position:relative;z-index:2}

/* ---------- Latin isolated inside Hebrew ---------- */
.lt{direction:ltr;unicode-bidi:isolate}

/* ---------- structure ---------- */
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:24px}
.sec{padding-block:88px}
.sec.tight{padding-block:0 88px}
/* alternating panel: the sketch's rhythm, in the dark language */
.sec.alt{
  background:rgba(255,255,255,.018);
  border-block:1px solid var(--hairline-soft);
}
.hero{padding-block:72px 48px}
.hero-home{padding-block:96px 72px;text-align:center}

@media (max-width:860px){
  .wrap{padding-inline:20px}
  .sec{padding-block:56px}
  .sec.tight{padding-block:0 56px}
  .hero{padding-block:48px 32px}
  .hero-home{padding-block:64px 48px}
}

/* ---------- typography ---------- */
h1,h2,h3{color:var(--ink);text-wrap:balance}
h1{
  font-size:clamp(34px,4.6vw,56px);
  font-weight:800;
  letter-spacing:-.03em;
  line-height:1.08;
  max-width:20ch;
}
.hero-home h1{
  font-size:clamp(40px,6vw,72px);
  line-height:1.05;
  max-width:16ch;
  margin-inline:auto;
}
h2{
  font-size:clamp(28px,3.2vw,38px);
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.15;
  max-width:20ch;
}
h3{font-size:22px;font-weight:600;line-height:1.35;letter-spacing:-.01em}
p{max-width:40em;text-wrap:pretty}

.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-size:13.5px;font-weight:500;letter-spacing:.05em;
  color:#a4b6ac;
  margin-bottom:20px;
}
.dot{
  width:6px;height:6px;border-radius:50%;flex:none;
  background:var(--green-lite);
  box-shadow:0 0 12px rgba(74,222,128,.85);
}

.lead{
  font-size:clamp(18px,2.2vw,22px);
  font-weight:300;
  line-height:1.55;
  letter-spacing:-.005em;
  max-width:34em;
  margin-top:24px;
  color:var(--ink);
}
.hero-home .lead{max-width:40ch;margin-inline:auto;text-wrap:balance}
.cap{font-size:14.5px;line-height:1.65;color:var(--muted);max-width:44em;font-weight:300}
.note{font-size:14.5px;color:var(--muted);font-weight:400}

/* section head */
.sechead{margin-bottom:48px}
.sechead p{margin-top:20px;color:var(--muted);font-weight:300}
.sechead .lead{color:var(--ink)}

/* ---------- brand mark (hero) ---------- */
.mark{
  position:relative;display:block;
  width:clamp(72px,12vw,96px);
  margin:0 auto clamp(18px,2.6vw,24px);
}
.mark::before{
  content:"";position:absolute;z-index:-1;
  inset:-58%;
  background:radial-gradient(closest-side,rgba(74,222,128,.34),rgba(74,222,128,.10) 52%,transparent 76%);
  filter:blur(14px);
}
.mark img{
  display:block;width:100%;height:auto;
  filter:drop-shadow(0 12px 26px rgba(74,222,128,.28));
}

/* ---------- wordmark ---------- */
.wm{
  display:inline-flex;align-items:center;gap:10px;
  text-decoration:none;color:var(--ink);flex:none;
}
.wm-mark{width:28px;height:28px;flex:none;display:block}
.wm-txt{
  direction:ltr;unicode-bidi:isolate;
  font-size:22px;font-weight:800;letter-spacing:-.04em;line-height:1;
}
.wm-txt .ai{color:var(--green-lite);text-shadow:0 0 18px rgba(74,222,128,.45)}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:inherit;font-size:16px;font-weight:500;line-height:1;
  border-radius:980px;
  padding:15px 24px;
  border:1px solid transparent;
  text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:transform .4s var(--ease),background-color .4s var(--ease),border-color .4s var(--ease),color .4s var(--ease),box-shadow .4s var(--ease);
}
.btn svg{flex:none}
.btn-sm{font-size:15px;padding:11px 20px}
.btn-primary{
  color:#04140b;
  background:linear-gradient(180deg,#6bea9d,#3fd07f);
  box-shadow:0 16px 34px -16px rgba(74,222,128,.8),
             0 0 0 1px rgba(255,255,255,.10) inset,
             0 1px 0 rgba(255,255,255,.42) inset;
}
.btn-primary:hover{background:linear-gradient(180deg,#7cf0aa,#4bd98b);transform:translateY(-1px);box-shadow:0 22px 44px -16px rgba(74,222,128,.95),0 0 0 1px rgba(255,255,255,.12) inset,0 1px 0 rgba(255,255,255,.5) inset}
.btn-primary:active{transform:translateY(0);background:linear-gradient(180deg,#5ce095,#37c576)}
.btn-mail{direction:ltr;unicode-bidi:isolate}
.btn-ghost{
  color:var(--muted);
  background:var(--card-bg);
  border-color:var(--hairline);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
.btn-ghost:hover{color:var(--ink);border-color:rgba(240,245,242,.2);transform:translateY(-1px)}
.btn-ghost:active{transform:translateY(0)}
.btn-ghost.done{color:var(--green-lite);border-color:rgba(74,222,128,.42)}
/* placeholders that keep their place in the UI */
.btn-ghost[aria-disabled="true"]{
  opacity:.42;cursor:default;pointer-events:none;
  color:var(--muted);
}

/* ---------- links ---------- */
a{color:var(--green-lite)}
.lnk{
  display:inline-flex;align-items:center;gap:9px;
  color:var(--green-lite);text-decoration:none;
  font-size:16px;font-weight:500;
}
.lnk .arw{flex:none;transition:transform .4s var(--ease)}
.lnk:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.lnk:hover .arw{transform:translateX(-3px)}

/* ---------- focus & skip ---------- */
:focus-visible{outline:2px solid var(--green-lite);outline-offset:3px;border-radius:6px}
main:focus{outline:none}
.skip,.vh{
  position:absolute;width:1px;height:1px;overflow:hidden;
  clip-path:inset(50%);white-space:nowrap;
}
.skip:focus{
  position:fixed;top:12px;inset-inline-end:12px;
  width:auto;height:auto;clip-path:none;z-index:200;
  background:linear-gradient(180deg,#6bea9d,#3fd07f);color:#04140b;
  padding:10px 18px;border-radius:999px;
  font-size:15px;font-weight:500;text-decoration:none;
}

/* ---------- header ---------- */
.hdr{
  position:sticky;top:0;
  background:rgba(6,11,8,.72);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--hairline);
}
.bar{height:var(--hdr-h);display:flex;align-items:center;gap:20px}
.navlinks{display:flex;align-items:center;gap:28px;margin-inline:auto}
.navlinks a{
  color:var(--muted);text-decoration:none;
  font-size:15px;font-weight:400;white-space:nowrap;
  padding-block:4px;
  transition:color .4s var(--ease);
}
.navlinks a:hover{color:var(--ink)}
.navlinks a[aria-current="page"]{
  color:var(--ink);
  text-decoration:underline;
  text-decoration-color:var(--green-lite);
  text-decoration-thickness:2px;
  text-underline-offset:8px;
}
.hdr-cta{flex:none}

.burger{
  display:none;align-items:center;gap:8px;
  height:38px;padding-inline:14px;
  margin-inline-start:auto;
  background:var(--card-bg);border:1px solid var(--hairline);border-radius:999px;
  color:var(--ink);cursor:pointer;
  font-family:inherit;font-size:14.5px;font-weight:500;line-height:1;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
/* the `hidden` attribute does not apply to inline SVG (UA sheet is
   namespaced to HTML), so the icons are swapped from aria-expanded */
.burger .ic-close{display:none}
.burger[aria-expanded="true"] .ic-open{display:none}
.burger[aria-expanded="true"] .ic-close{display:block}
.menu{
  background:rgba(6,11,8,.96);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-top:1px solid var(--hairline);
}
.menu ul{list-style:none;padding:8px 0 16px}
.menu a{
  display:block;padding:12px 0;
  color:var(--ink);text-decoration:none;font-size:17px;
  border-bottom:1px solid var(--hairline-soft);
}
.menu li:last-child a{border-bottom:0}
.menu a[aria-current="page"]{color:var(--green-lite)}
@media (min-width:861px){ .menu{display:none !important} }
@media (max-width:860px){
  .navlinks{display:none}
  .burger{display:inline-flex}
  .bar{gap:12px}
}
@media (max-width:380px){
  .burger{padding-inline:11px;gap:6px}
  .btn-sm{padding:11px 16px}
  .wm{gap:8px}
}

/* ---------- cards ---------- */
.card{
  display:flex;flex-direction:column;align-items:flex-start;
  background:var(--card-bg);
  border:1px solid var(--hairline);
  border-radius:20px;
  padding:28px;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  transition:border-color .4s var(--ease),transform .4s var(--ease);
}
.card:hover,.card:focus-within{
  border-color:rgba(74,222,128,.42);
  transform:translateY(-2px);
}
.card h3+p{margin-top:12px;color:var(--muted);font-size:17px;line-height:1.65;font-weight:300}
.card .lnk{margin-top:auto;padding-top:22px}
.card--stmt .cap{margin-top:auto;padding-top:16px}

.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.grid-6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:24px}
.grid-6 .span2{grid-column:span 2}
.grid-6 .span3{grid-column:span 3}
@media (max-width:980px){
  .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-6{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-6 .span2,.grid-6 .span3{grid-column:span 1}
}
@media (max-width:860px){
  .grid-2,.grid-3,.grid-6{grid-template-columns:1fr}
}

/* ---------- definition rows (five work domains, FAQ) ---------- */
.rows{border-top:1px solid var(--hairline)}
.rows > div{
  display:grid;
  grid-template-columns:minmax(0,280px) minmax(0,1fr);
  gap:14px 56px;
  padding-block:30px;
  border-bottom:1px solid var(--hairline);
}
.rows h3{padding-top:2px}
.rows p{color:var(--muted);max-width:44em;font-weight:300}
.rows--faq h3{font-size:20px}
.rows--flat > div{grid-template-columns:1fr}
@media (max-width:860px){
  .rows > div{grid-template-columns:1fr;gap:10px;padding-block:26px}
}

/* ---------- light items (paid page) ---------- */
.items{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
.items > div{border-top:1px solid var(--hairline);padding-top:18px}
.items h3{font-size:19px}
.items p{margin-top:8px;font-size:14.5px;color:var(--muted);line-height:1.6;font-weight:300}
@media (max-width:980px){.items{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:620px){.items{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.items{grid-template-columns:1fr}}

/* ---------- report section ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:start}
@media (max-width:860px){.split{grid-template-columns:1fr;gap:40px}}
.reportcard{
  background:var(--card-bg);
  border:1px solid var(--hairline);
  border-radius:20px;
  padding:28px;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
.reportcard .rc-title{
  font-size:14px;color:var(--muted);
  padding-bottom:18px;margin-bottom:22px;
  border-bottom:1px solid var(--hairline);
}
.rc-row{display:grid;grid-template-columns:minmax(0,1fr) 42%;gap:20px;align-items:center;padding-block:13px}
.rc-row span{font-size:15px;line-height:1.4}
.rc-bar{height:6px;border-radius:999px;background:rgba(240,245,242,.09);overflow:hidden}
.rc-bar i{display:block;height:100%;background:var(--green);opacity:.62;border-radius:999px}
@media (max-width:420px){
  .rc-row{grid-template-columns:1fr;gap:9px;align-items:stretch}
}

/* ---------- click → citation diagram ---------- */
.flowcol h3{font-size:15px;font-weight:500;color:var(--muted);letter-spacing:.03em;margin-bottom:22px}
.flow{display:flex;flex-direction:column;align-items:stretch;max-width:280px}
.pill{
  display:flex;align-items:center;justify-content:center;
  min-height:46px;padding:10px 22px;
  border:1px solid var(--hairline);border-radius:999px;
  background:var(--card-bg);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  font-size:16px;line-height:1.35;text-align:center;
}
.flow .join{
  width:1px;height:24px;background:var(--hairline);
  margin-inline:auto;flex:none;
}
@media (max-width:860px){.flow{max-width:none}}

/* ---------- chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:10px;list-style:none}
.chips li{
  border:1px solid var(--hairline);border-radius:999px;
  background:var(--card-bg);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  padding:8px 17px;font-size:14px;line-height:1.4;color:var(--ink);
}

/* ---------- placeholders ---------- */
/* the logo wall: <a class="logo"> tiles holding a white monochrome PNG.
   A bare <div class="logo">text</div> still works as a placeholder tile. */
.logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.logo{
  height:88px;width:100%;
  border:1px solid var(--hairline);border-radius:14px;
  background:var(--card-bg-2);
  display:flex;align-items:center;justify-content:center;
  padding:14px 18px;
  color:var(--faint-txt);font-size:13px;text-decoration:none;
  transition:border-color .4s var(--ease);
}
/* width/height on the <img> are only there to reserve space before load —
   width:auto/height:auto hands the ratio back to the file, so nothing skews. */
.logo img{
  max-height:46px;max-width:82%;
  width:auto;height:auto;
  object-fit:contain;
  opacity:.8;
  transition:opacity .4s var(--ease);
}
.logo:hover,.logo:focus-visible{border-color:rgba(74,222,128,.42)}
.logo:hover img,.logo:focus-visible img{opacity:1}
.logo:focus-visible{outline:2px solid var(--green-lite);outline-offset:3px;border-radius:14px}
.logos--3{grid-template-columns:repeat(3,minmax(0,1fr));max-width:560px;margin-inline:0}
@media (max-width:860px){
  .logos{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  .logo{height:72px;padding:10px 14px}
  .logo img{max-height:38px}
}
@media (max-width:480px){.logos{grid-template-columns:repeat(2,minmax(0,1fr))}}

.ph{
  border:1px solid var(--hairline);border-radius:20px;
  background:var(--card-bg-2);
  display:flex;align-items:center;justify-content:center;
  color:var(--faint-txt);font-size:14px;
}
.ph.map{aspect-ratio:16/9;width:100%}
.avatar{
  width:72px;height:72px;border-radius:50%;
  border:1px solid var(--hairline);background:var(--card-bg-2);
}

/* ---------- contact ---------- */
.biglines{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.big{
  font-size:clamp(24px,3vw,34px);
  font-weight:400;line-height:1.45;letter-spacing:-.01em;
  color:var(--ink);text-decoration:none;
  transition:color .4s var(--ease);
}
a.big:hover{color:var(--green-lite)}
.actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.addr-link{color:var(--muted);text-decoration:none;border-bottom:1px solid var(--hairline)}
.addr-link:hover{color:var(--ink)}

/* ---------- footer ---------- */
.ftr{border-top:1px solid var(--hairline);padding-block:64px 28px}
.ftr-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}
.ftr-h{
  margin:0 0 16px;font-size:13px;font-weight:500;
  letter-spacing:.04em;color:var(--muted);
}
.ftr ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.ftr a{color:var(--ink);text-decoration:none;font-size:15px;transition:color .4s var(--ease)}
.ftr a:hover{color:var(--green-lite)}
.ftr .addr{margin-top:16px;font-size:14px;color:var(--muted);line-height:1.7;font-weight:300}
.ftr-btm{
  margin-top:56px;padding-top:22px;
  border-top:1px solid var(--hairline);
  font-size:13px;color:var(--muted);
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
}
.stage-tag{color:var(--faint-txt);font-size:12.5px}
.sep{color:var(--faint)}
@media (max-width:860px){
  .ftr-grid{grid-template-columns:1fr 1fr;gap:32px}
  .ftr{padding-block:48px 24px}
  .ftr-btm{margin-top:40px}
}
@media (max-width:520px){.ftr-grid{grid-template-columns:1fr}}

/* ---------- utilities ---------- */
.stack-24 > * + *{margin-top:24px}
.stack-16 > * + *{margin-top:16px}
.mt-4{margin-top:4px}
.mt-16{margin-top:16px}
.mt-18{margin-top:18px}
.mt-32{margin-top:32px}
.mt-48{margin-top:48px}
.mt-56{margin-top:56px}
.muted{color:var(--muted)}
.pagenote{padding-bottom:80px}
.narrow{max-width:720px}

/* ---------- motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .light{animation:none}
  *,*::before,*::after{transition-duration:.01ms !important;animation:none !important}
  .btn:hover,.btn:active,.card:hover,.lnk:hover .arw{transform:none}
}

/* long-form legal pages (privacy, accessibility): one readable column */
.legal{max-width:72ch;margin-top:8px}
/* ‏08/09/2026 — כותרות הפסקאות בעמודים המשפטיים: לא יורשות את הכותרות
   השיווקיות (‏weight 800, ‏max-width 20ch, ‏text-wrap balance ששובר לשתי
   שורות מאוזנות). כאן זה טקסט רשמי — שורה אחת, משקל 600, גודל מתון. */
.legal h2{font-size:clamp(21px,2.2vw,24px);font-weight:600;letter-spacing:0;line-height:1.3;max-width:none;text-wrap:pretty;margin-top:44px;margin-bottom:12px}
.legal h3{font-size:18px;font-weight:600;letter-spacing:0;line-height:1.35;max-width:none;text-wrap:pretty;margin-top:24px;margin-bottom:8px}
.legal p{color:var(--muted);font-size:17px;line-height:1.7;margin:0 0 14px}
.legal ul,.legal ol{margin:0 0 18px;padding-inline-start:24px;color:var(--muted);font-size:17px;line-height:1.7}
.legal ul{list-style:disc}
.legal ol{list-style:decimal}
.legal li{margin-bottom:8px}
.legal li::marker{color:var(--green-lite)}
.legal strong{color:var(--ink);font-weight:600}
.legal a{color:var(--green-lite);text-decoration:none}
.legal a:hover{text-decoration:underline}
.legal .upd{margin-top:40px;font-size:14px;color:var(--faint-txt)}