/* ============================================================
   JUDARO · Site header + section bar (shared component)
   רכיב עצמאי, כמו הפוטר: מביא איתו את הפלטה שלו, ולכן יושב
   אותו דבר על עמודי האתר, על מרכז הידע ועל מדריכי החיבור.
   המקור: judaro-seo/data/header*.html, מוזרק ע״י sync_chrome.py.
   ============================================================ */

.jd-top,.jd-sub{
  --t-bg:#FDFEFD;
  --t-ink:#1B2733;
  --t-muted:#535F6A;
  --t-faint:#66707A;
  --t-line:#D8DDDB;
  --t-field:#ECEFEE;
  --t-action:#22564F;
  --t-action-hover:#1A443F;
  --t-action-ink:#F6F8F7;
}
[data-theme="dark"] .jd-top,[data-theme="dark"] .jd-sub{
  --t-bg:#16201E;--t-ink:#E6EBE9;--t-muted:#A9B4B0;--t-faint:#7E8985;--t-line:#28342F;--t-field:#1A2523;
  --t-action:#5FA898;--t-action-hover:#78BCAD;--t-action-ink:#0E1614;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .jd-top,:root:not([data-theme="light"]) .jd-sub{
    --t-bg:#16201E;--t-ink:#E6EBE9;--t-muted:#A9B4B0;--t-faint:#7E8985;--t-line:#28342F;--t-field:#1A2523;
    --t-action:#5FA898;--t-action-hover:#78BCAD;--t-action-ink:#0E1614;
  }
}

html{scroll-padding-top:84px}

/* ---------- header ---------- */
.jd-top{
  position:sticky;top:0;z-index:50;
  background:var(--t-bg);
  border-bottom:1px solid var(--t-line);
  font-family:'IBM Plex Sans Hebrew','Heebo',system-ui,-apple-system,sans-serif;
  font-size:15.5px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
.jd-top *{box-sizing:border-box}
.jd-top a{text-decoration:none}
.jd-top a:hover{text-decoration:none}
.jd-top-in{
  max-width:1200px;margin-inline:auto;
  padding-inline:clamp(16px,4vw,40px);
  min-height:64px;
  display:flex;align-items:center;gap:8px 28px;
}
.jd-top-logo{display:flex;align-items:center;flex:none;padding-block:8px}
.jd-top-wm{
  display:block;width:122px;height:25px;background:var(--t-action);
  -webkit-mask:url(/assets/logo-full.svg) center / contain no-repeat;
  mask:url(/assets/logo-full.svg) center / contain no-repeat;
}
.jd-top-nav{display:flex;align-items:center;gap:4px 26px;margin-inline-start:auto}
.jd-top-nav a,.jd-top-lang{
  color:var(--t-muted);padding-block:6px;white-space:nowrap;
  border-bottom:2px solid transparent;
}
.jd-top-nav a:hover,.jd-top-lang:hover{color:var(--t-ink)}
.jd-top-nav a[aria-current]{color:var(--t-ink);border-bottom-color:var(--t-action)}
.jd-top-end{display:flex;align-items:center;gap:20px;flex:none}
.jd-top-lang{font-size:14.5px}
.jd-top-cta{
  display:inline-flex;align-items:center;white-space:nowrap;
  background:var(--t-action);color:var(--t-action-ink) !important;
  padding:9px 18px;border-radius:3px;font-size:15px;font-weight:500;
}
.jd-top-cta:hover{background:var(--t-action-hover)}
.jd-top a:focus-visible{outline:2px solid var(--t-action);outline-offset:3px;border-radius:2px}

/* phone: logo + button on the first row, the links on a second row */
@media (max-width:760px){
  html{scroll-padding-top:112px}
  .jd-top-in{flex-wrap:wrap;min-height:0;padding-block:8px 0;gap:0 16px}
  .jd-top-end{order:2;margin-inline-start:auto;gap:14px}
  .jd-top-nav{
    order:3;flex-basis:100%;margin-inline-start:0;gap:0 22px;
    overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    border-top:1px solid var(--t-line);margin-top:8px;
  }
  .jd-top-nav::-webkit-scrollbar{display:none}
  .jd-top-nav a{padding-block:9px 7px;font-size:15px}
  .jd-top-wm{width:104px;height:21px}
  .jd-top-cta{padding:7px 14px;font-size:14.5px}
}

/* ---------- section bar (connect guides) ---------- */
.jd-sub{
  background:var(--t-bg);
  border-bottom:1px solid var(--t-line);
  font-family:'IBM Plex Sans Hebrew','Heebo',system-ui,-apple-system,sans-serif;
  font-size:14.5px;line-height:1.4;
}
.jd-sub *{box-sizing:border-box}
.jd-sub-in{
  max-width:1200px;margin-inline:auto;
  padding-inline:clamp(16px,4vw,40px);
  display:flex;align-items:center;gap:2px;
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.jd-sub-in::-webkit-scrollbar{display:none}
.jd-sub a{
  flex:none;color:var(--t-muted);text-decoration:none;white-space:nowrap;
  padding:11px 10px 9px;border-bottom:2px solid transparent;
}
.jd-sub a:hover{color:var(--t-ink);text-decoration:none}
.jd-sub a[aria-current]{color:var(--t-action);border-bottom-color:var(--t-action);font-weight:500}
.jd-sub-home{font-weight:600;color:var(--t-ink) !important;padding-inline-start:0 !important}
.jd-sub-label{flex:none;color:var(--t-faint);font-size:12.5px;padding:11px 10px 9px 4px;white-space:nowrap}
.jd-sub-sep{flex:none;width:1px;height:18px;background:var(--t-line);margin-inline:8px}
.jd-sub a:focus-visible{outline:2px solid var(--t-action);outline-offset:-2px;border-radius:2px}