/* KPIbara — shared design system (header, footer, tokens, buttons). Calm v4, Oct 2026 */
:root{
  --k-navy:#10243E; --k-ink:#10243E; --k-muted:#3B4B60; --k-cream:#F6F4EE; --k-sand:#ECE8DD;
  --k-card:#FBFAF6; --k-line:#DDD8CB; --k-line2:#E4E0D5; --k-yellow:#FFD23F; --k-gold:#F2B300;
  --k-green:#1E7A4C; --k-white:#FFFFFF; --k-on-navy:#C9D2DE;
  --k-font:'Familjen Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --k-radius:10px; --k-gutter:clamp(16px,5vw,80px); --k-max:1280px;
}
html[lang="he"]{--k-font:'Heebo','Familjen Grotesk',system-ui,sans-serif}

/* Skip link */
.k-skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:10001;background:var(--k-navy);color:#fff!important;padding:12px 18px;border-radius:8px;font:600 15px/1 var(--k-font);text-decoration:none}
.k-skip:focus{top:12px}

/* ---------- Header ---------- */
header.kh{position:sticky;top:0;z-index:900;background:rgba(246,244,238,.96);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--k-line2);font-family:var(--k-font);color:var(--k-ink);margin:0;padding:0;width:100%;height:auto;display:block}
header.kh *{box-sizing:border-box}
.kh-in{max-width:var(--k-max);margin:0 auto;padding:16px var(--k-gutter);display:flex;align-items:center;justify-content:space-between;gap:24px}
.kh a{color:var(--k-ink);text-decoration:none}
.kh-logo{display:inline-flex;align-items:flex-end;gap:8px;direction:ltr;flex-shrink:0}
.kh-logo svg{display:block}
.k-kpi{font-family:'DM Sans',sans-serif;font-weight:700;font-size:25px;letter-spacing:-1px;line-height:1;color:var(--k-ink)}
.k-bara{font-family:'Caveat',cursive;font-weight:700;font-size:30px;line-height:1;color:var(--k-gold)}
header.kh nav.kh-nav{position:static;display:block;background:none;height:auto;padding:0;width:auto;box-shadow:none;border:0;backdrop-filter:none;-webkit-backdrop-filter:none}
.kh-nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:26px}
.kh-nav a{font-size:16px;font-weight:500;letter-spacing:0;text-transform:none;padding:6px 0;border-bottom:2px solid transparent}
.kh-nav a:hover,.kh-nav a[aria-current="page"]{border-bottom-color:var(--k-yellow)}
.kh-right{display:flex;align-items:center;gap:14px}
.kh-lang{display:flex;gap:2px}
.kh-lang a{font-size:14px;font-weight:700;padding:7px 10px;border-radius:999px;line-height:1}
.kh-lang a[aria-current="true"]{background:var(--k-navy);color:#fff}
.kh-lang a:not([aria-current="true"]):hover{background:var(--k-sand)}
.k-btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;font-family:var(--k-font);font-weight:600;text-decoration:none;border-radius:var(--k-radius);border:0;cursor:pointer;line-height:1.2;transition:transform .15s,background-color .15s}
.k-btn:hover{transform:translateY(-1px)}
.k-btn-dark{background:var(--k-navy);color:#fff!important}
.k-btn-dark:hover{background:#1B3758}
.k-btn-yellow{background:var(--k-yellow);color:var(--k-navy)!important}
.k-btn-yellow:hover{background:#FFDC66}
.kh-cta{font-size:15px;padding:12px 18px}
.kh-burger{display:none;width:44px;height:44px;border:1px solid var(--k-line);border-radius:10px;background:#fff;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0}
.kh-burger span{display:block;width:20px;height:2px;background:var(--k-navy);border-radius:2px;transition:transform .2s,opacity .2s}
.kh-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.kh-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.kh-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.kh-drawer{border-top:1px solid var(--k-line2);background:var(--k-cream);padding:12px var(--k-gutter) 24px}
.kh-drawer[hidden]{display:none}
.kh-drawer ul{list-style:none;margin:0;padding:0}
.kh-drawer li a{display:block;padding:14px 0;font-size:19px;font-weight:600;border-bottom:1px solid var(--k-line2)}
.kh-drawer .kh-lang{margin:18px 0}
.kh-drawer .k-btn{width:100%;padding:16px;font-size:17px}
@media (max-width:1060px){.kh-nav ul{gap:18px}.kh-nav a{font-size:15px}}
@media (max-width:960px){.kh-nav,.kh-right>.kh-lang,.kh-right>.kh-cta{display:none!important}.kh-burger{display:inline-flex}}
@media (min-width:961px){.kh-drawer{display:none!important}}

/* ---------- Footer ---------- */
footer.kf{display:block;background:var(--k-cream);border-top:1px solid var(--k-line2);color:var(--k-muted);font-family:var(--k-font);font-size:15px;margin:0;padding:0;text-align:start;width:100%}
footer.kf *{box-sizing:border-box}
.kf-in{max-width:var(--k-max);margin:0 auto;padding:36px var(--k-gutter);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 32px}
.kf-brand{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.kf-brand .k-kpi{font-size:21px}.kf-brand .k-bara{font-size:26px}
.kf .kf-logo{direction:ltr;display:inline-flex;align-items:baseline;text-decoration:none}
.kf nav{position:static;display:block;background:none;height:auto;padding:0;width:auto}
.kf nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px}
.kf a,.kf button.kf-link{color:var(--k-muted);font:inherit;text-decoration:underline;text-underline-offset:3px;background:none;border:0;padding:0;cursor:pointer}
.kf a:hover,.kf button.kf-link:hover{color:var(--k-ink)}
.kf-lang a{text-decoration:none;font-weight:600}
.kf-lang a[aria-current="true"]{color:var(--k-ink);text-decoration:underline}
.kf-copy{flex-basis:100%;font-size:13px;color:#5A6878}

/* Focus visibility (WCAG 2.4.7) */
.kh a:focus-visible,.kh button:focus-visible,.kf a:focus-visible,.kf button:focus-visible,.k-btn:focus-visible{outline:3px solid #2F6FDE;outline-offset:3px;border-radius:6px}

@media (prefers-reduced-motion:reduce){.k-btn,.kh-burger span{transition:none}.k-btn:hover{transform:none}}
@media print{header.kh,.kh-drawer{position:static}.kh-burger,.kh-drawer{display:none!important}}

/* Neutralise legacy page-level nav/footer rules on older pages */
header.kh nav,footer.kf nav{position:static!important;top:auto!important;background:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;box-shadow:none!important;height:auto!important;min-height:0!important;padding:0!important;margin:0!important;width:auto!important;z-index:auto!important}
header.kh .kh-drawer nav,footer.kf nav{display:block!important}
header.kh nav.kh-nav{display:block}
@media (max-width:960px){header.kh nav.kh-nav{display:none!important}}
header.kh a,footer.kf a,footer.kf button{text-transform:none;letter-spacing:normal;font-family:var(--k-font)}
header.kh .k-kpi,footer.kf .k-kpi{font-family:'DM Sans',sans-serif;letter-spacing:-1px}
header.kh .k-bara,footer.kf .k-bara{font-family:'Caveat',cursive;letter-spacing:0}
header.kh ul,footer.kf ul{list-style:none}
header.kh li,footer.kf li{margin:0;padding:0}