/* Lambda Force — shared stylesheet
   One set of rules serves LTR and RTL: layout uses logical properties only.
   Palette and type carried verbatim from the capability statement. */

:root{
  /* ground */
  --paper:#EEF0F4;
  --card:#F8F9FC;
  --ink:#13162B;
  --soft:#5A5F73;
  --rule:#C9CDDA;
  /* accents, named for the sidebands they came from */
  --lsb:#6B3BEF;
  --mid:#5B57F2;
  --usb:#2B7FF2;
  /* the brand blue reaches only 3.4:1 on paper — fine for rules and graphics
     (3:1 threshold), too low for small text. This is the same hue, darkened
     to 4.56:1, used ONLY where the blue becomes type. */
  --usb-ink:#246BCB;

  --display:"IBM Plex Sans Condensed","Arial Narrow",Helvetica,sans-serif;
  --body:"IBM Plex Serif",Georgia,serif;
  --mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;

  /* 4px spacing scale */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px;

  --measure:68ch;
  --gutter:clamp(20px,5vw,64px);
  --maxw:1180px;
}

html[lang="he"]{
  --display:"IBM Plex Sans Hebrew","Arial Hebrew",Arial,sans-serif;
  --body:"Frank Ruhl Libre","David Libre",Georgia,serif;
  --mono:"IBM Plex Sans Hebrew","Arial Hebrew",Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html:focus-within{scroll-padding-block-start:88px}

body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:clamp(16px,0.55vw + 14.5px,17.5px);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img,svg{max-width:100%;display:block}
a{color:inherit}

:focus-visible{outline:2px solid var(--usb);outline-offset:3px;border-radius:2px}

.wrap{max-inline-size:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}

.skip{
  position:absolute;inset-block-start:-100px;inset-inline-start:var(--s4);
  background:var(--ink);color:var(--paper);padding:var(--s3) var(--s4);
  font-family:var(--mono);font-size:13px;z-index:100;
}
.skip:focus{inset-block-start:var(--s4)}

/* ── eyebrow: the instrument-panel label used throughout ───────────── */
.eyebrow{
  font-family:var(--mono);font-size:11px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:var(--soft);
}
html[lang="he"] .eyebrow{letter-spacing:.12em}

/* ── header ─────────────────────────────────────────────────────────── */
.site-header{
  position:sticky;inset-block-start:0;z-index:50;
  background:color-mix(in srgb,var(--paper) 88%,transparent);
  backdrop-filter:saturate(150%) blur(10px);
  border-block-end:1px solid var(--rule);
}
.header-in{
  display:flex;align-items:center;gap:var(--s5);
  block-size:72px;
}
.brand{display:flex;align-items:center;gap:var(--s3);text-decoration:none;flex:0 0 auto}
.brand svg{block-size:30px;inline-size:30px}
.wordmark{
  font-family:var(--display);font-weight:700;font-size:19px;
  letter-spacing:.11em;text-transform:uppercase;white-space:nowrap;line-height:1;
}
.wordmark em{font-style:normal;color:var(--lsb)}
.wordmark b{font-weight:700;color:var(--usb-ink)}

.nav{
  display:flex;gap:var(--s5);margin-inline-start:auto;align-items:center;
  font-family:var(--mono);font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;
}
html[lang="he"] .nav{letter-spacing:.06em;font-size:14px}
.nav a{text-decoration:none;color:var(--soft);padding-block:var(--s2);position:relative;
  transition:color .18s ease}
.nav a::after{
  content:"";position:absolute;inset-block-end:2px;inset-inline:0;
  block-size:1.5px;background:var(--usb);transform:scaleX(0);transform-origin:inline-start;
  transition:transform .22s ease;
}
.nav a:hover{color:var(--ink)}
.nav a:hover::after{transform:scaleX(1)}

.lang{
  display:flex;align-items:center;gap:var(--s2);
  font-family:var(--mono);font-size:12.5px;letter-spacing:.1em;
  padding-inline-start:var(--s5);margin-inline-start:var(--s2);
  border-inline-start:1px solid var(--rule);
}
.lang a{text-decoration:none;color:var(--soft);transition:color .18s ease}
.lang a:hover{color:var(--ink)}
.lang [aria-current]{color:var(--ink);font-weight:600}

.nav-toggle{
  display:none;margin-inline-start:auto;background:none;border:1px solid var(--rule);
  font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);padding:var(--s2) var(--s3);cursor:pointer;
}

/* ── hero ───────────────────────────────────────────────────────────── */
.hero{padding-block:clamp(var(--s7),9vw,var(--s9)) var(--s7);text-align:center}
.hero .eyebrow{display:block;margin-block-end:var(--s5)}
.headline{
  font-family:var(--display);font-weight:600;
  font-size:clamp(33px,5.1vw,56px);line-height:1.05;letter-spacing:-.012em;
  max-inline-size:22ch;margin-inline:auto;text-wrap:balance;
}
html[lang="he"] .headline{letter-spacing:0;line-height:1.16;max-inline-size:20ch}
.subhead{
  font-family:var(--mono);font-weight:500;
  font-size:clamp(15px,1.5vw,19px);letter-spacing:.015em;line-height:1.4;
  color:var(--usb-ink);margin-block-start:var(--s4);
  max-inline-size:40ch;margin-inline:auto;text-wrap:balance;
}
html[lang="he"] .subhead{letter-spacing:0;font-size:clamp(17px,1.7vw,21px)}

.deck{
  margin:var(--s5) auto 0;max-inline-size:60ch;font-size:1.06rem;
  line-height:1.6;color:#20243B;text-wrap:pretty;
}

.cta-row{margin-block-start:var(--s6);display:flex;gap:var(--s4);justify-content:center;flex-wrap:wrap}
.cta{
  display:inline-flex;align-items:center;gap:var(--s2);
  font-family:var(--mono);font-size:13px;letter-spacing:.13em;text-transform:uppercase;
  text-decoration:none;padding:var(--s3) var(--s5);
  background:var(--ink);color:var(--paper);
  border:1px solid var(--ink);
  transition:background .18s ease,color .18s ease;
}
.cta:hover{background:transparent;color:var(--ink)}
.cta.ghost{background:transparent;color:var(--ink);border-color:var(--rule)}
.cta.ghost:hover{border-color:var(--ink)}
html[lang="he"] .cta{letter-spacing:.04em;font-size:14px}

/* ── signature: the sweeping spectrum trace ─────────────────────────── */
.spectrum-frame{margin-block-start:clamp(var(--s6),5vw,var(--s8));position:relative}
.spectrum{inline-size:100%;block-size:auto;max-inline-size:760px;margin-inline:auto}
/* the trace draws itself once, left to right, like an analyser sweep */
.spectrum .trace{
  stroke-dasharray:1400;stroke-dashoffset:1400;
  animation:sweep 2.4s cubic-bezier(.33,.1,.25,1) .25s forwards;
}
.spectrum .callout{opacity:0;animation:settle .7s ease 2.3s forwards}
@keyframes sweep{to{stroke-dashoffset:0}}
@keyframes settle{to{opacity:1}}

/* ── sections ───────────────────────────────────────────────────────── */
.section{border-block-start:1px solid var(--rule);padding-block:clamp(var(--s7),7vw,var(--s9))}
.section-head{text-align:center;margin-block-end:var(--s7)}
.section-head .eyebrow{display:block;margin-block-end:var(--s3)}
.h2{
  font-family:var(--display);font-weight:600;
  font-size:clamp(26px,3.4vw,38px);line-height:1.12;letter-spacing:-.005em;
  text-wrap:balance;
}
html[lang="he"] .h2{letter-spacing:0}
.h2-lead{
  margin:var(--s3) auto 0;max-inline-size:56ch;color:var(--soft);
  font-size:1rem;line-height:1.55;text-wrap:pretty;
}

/* ── cards ──────────────────────────────────────────────────────────── */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5)}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s5)}
.card{
  background:var(--card);
  border-block-start:2.5px solid var(--lsb);
  padding:var(--s5) var(--s5) var(--s6);
  transition:transform .2s ease,box-shadow .2s ease;
}
.grid-3 .card:nth-child(2),.grid-2 .card:nth-child(2){border-block-start-color:var(--mid)}
.grid-3 .card:nth-child(3),.grid-2 .card:nth-child(3){border-block-start-color:var(--usb)}
.grid-2 .card:nth-child(4){border-block-start-color:var(--usb)}
.card:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(19,22,43,.07)}
.card h3{
  font-family:var(--display);font-weight:600;font-size:1.2rem;line-height:1.2;
  letter-spacing:.01em;margin-block-end:var(--s3);
}
.card p{font-size:1rem;line-height:1.58;color:#262B45}

/* ── track record: a spec-sheet index, not a marketing sequence ─────── */
.work{border-block-start:1px solid var(--rule)}
.work-row{
  display:grid;grid-template-columns:auto 1fr;gap:var(--s5);
  align-items:baseline;
  padding-block:var(--s6);
  border-block-end:1px solid var(--rule);
}
.work-num{
  font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.16em;
  color:var(--soft);padding-block-start:6px;
}
.work-name{
  font-family:var(--display);font-weight:600;font-size:clamp(19px,2.2vw,24px);
  line-height:1.2;letter-spacing:.005em;
}
.work-name .tag{
  display:block;font-family:var(--mono);font-size:12px;font-weight:400;
  letter-spacing:.16em;text-transform:uppercase;color:var(--usb-ink);
  margin-block-start:var(--s2);
}
html[lang="he"] .work-name .tag{letter-spacing:.06em}
.work-body p{margin-block-start:var(--s3);max-inline-size:var(--measure);color:#262B45}

.work-note{
  margin-block-start:var(--s6);text-align:center;
  font-size:1rem;color:var(--soft);
}
.work-note a{color:var(--ink);text-underline-offset:4px;text-decoration-thickness:1px}
.work-note a:hover{color:var(--usb-ink)}

/* ── contact ────────────────────────────────────────────────────────── */
.contact-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5);
  margin-block-start:var(--s7);
}
.contact-item{
  border-block-start:2.5px solid var(--rule);padding-block-start:var(--s4);
}
.contact-item:nth-child(1){border-block-start-color:var(--lsb)}
.contact-item:nth-child(2){border-block-start-color:var(--mid)}
.contact-item:nth-child(3){border-block-start-color:var(--usb)}
.contact-item .eyebrow{display:block;margin-block-end:var(--s2)}
.contact-item a,.contact-item span{
  font-family:var(--display);font-weight:600;font-size:clamp(17px,1.9vw,21px);
  text-decoration:none;letter-spacing:.005em;line-height:1.3;display:inline-block;
}
.contact-item a{border-block-end:1px solid var(--rule);transition:border-color .18s ease,color .18s ease}
.contact-item a:hover{color:var(--usb-ink);border-block-end-color:var(--usb)}

/* ── footer ─────────────────────────────────────────────────────────── */
.site-footer{
  border-block-start:1px solid var(--rule);
  padding-block:var(--s6);
  display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--soft);
}
html[lang="he"] .site-footer{letter-spacing:.04em;font-size:13px;text-transform:none}
.site-footer .spacer{margin-inline-start:auto}
.site-footer a{text-decoration:none;color:var(--soft)}
.site-footer a[hreflang]{font-size:13px;letter-spacing:.02em}
.site-footer a:hover{color:var(--ink)}

/* ── bidi helper: Latin technical terms inside Hebrew runs ──────────── */
.ltr{direction:ltr;unicode-bidi:isolate}

/* ── responsive ─────────────────────────────────────────────────────── */
@media (max-width:900px){
  .grid-3{grid-template-columns:1fr 1fr}
  .contact-grid{grid-template-columns:1fr}
  .nav{gap:var(--s4);font-size:11.5px}
}

@media (max-width:720px){
  .nav{
    display:none;position:absolute;inset-block-start:72px;inset-inline:0;
    flex-direction:column;align-items:flex-start;gap:0;
    background:var(--paper);border-block-end:1px solid var(--rule);
    padding:var(--s3) var(--gutter) var(--s5);
  }
  .nav.open{display:flex}
  .nav a{inline-size:100%;padding-block:var(--s3);border-block-end:1px solid var(--rule)}
  .nav a::after{content:none}
  .nav-toggle{display:block;order:3}
  .lang{margin-inline-start:auto;padding-inline-start:0;border-inline-start:0;order:2}
  .grid-3,.grid-2{grid-template-columns:1fr}
  .work-row{grid-template-columns:1fr;gap:var(--s2);padding-block:var(--s5)}
  .work-num{padding-block-start:0}
  .site-footer{flex-direction:column;align-items:flex-start;gap:var(--s2)}
  .site-footer .spacer{margin-inline-start:0}
}

@media (max-width:480px){
  .header-in{gap:var(--s3)}
  .brand{gap:var(--s2)}
  .brand svg{block-size:26px;inline-size:26px}
  .wordmark{font-size:15px;letter-spacing:.07em}
  .lang{font-size:11px;letter-spacing:.04em;gap:var(--s1)}
  .nav-toggle{font-size:11px;letter-spacing:.08em;padding:6px var(--s2)}
  .hero .eyebrow{font-size:10px;letter-spacing:.14em}
  .cta{inline-size:100%;justify-content:center}
  .cta-row{gap:var(--s3)}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .spectrum .trace{stroke-dashoffset:0}
  .spectrum .callout{opacity:1}
}

@media print{
  .site-header,.nav-toggle,.cta-row{display:none}
  body{background:#fff}
}
