/* ==========================================================================
   KLIKOD — קליק אחד קדימה

   שלושה עקרונות, ואין רביעי:
     1. גאומטריה ריבועית. פינות של 2–4 פיקסלים בלבד. אין כדורים.
     2. הפרדה בקו, לא בצל. מה שמפריד הוא קו־שיער.
     3. הטורקיז הוא המבטא היחיד — לקווים, למיקוד ולהדגשה. לא כצבע מילוי גדול.

   שלושה חומרים: נייבי עמוק (המותג) · שנהב חמים (הרקע — נייר, לא לבן קר) ·
   טורקיז (מבטא יחיד). אל תוסיפו גוונים חדשים. אם צריך הדגשה — השתמשו בטורקיז.
   ========================================================================== */

/* ---------- 1. חומרים ---------- */
:root{
  /* נייבי — המותג. פעולות ראשיות, כותרות, משטחים כהים */
  --k-brand:#023A6B;
  --k-brand-dark:#001A3F;
  --k-brand-soft:#EDF1F5;
  --k-brand-line:#CFD9E3;

  /* לילה — הצבע הכהה ביותר במערכת */
  --k-night:#00122B;
  --k-night-2:#001A3F;

  /* טורקיז — המבטא היחיד */
  --k-acc:#0A736C;
  --k-acc-dark:#075F59;
  --k-acc-bright:#4CDCCB;      /* על משטחים כהים בלבד */
  --k-acc-soft:#EAF2F1;
  --k-acc-line:#BFD8D5;

  /* משטחים וטקסט */
  --k-paper:#F5F4EF;           /* שנהב חמים — הנייר שהכול יושב עליו */
  --k-paper-2:#EDECE5;
  --k-card:#FFFFFF;
  --k-text:#141F2B;
  --k-muted:#5C6874;
  --k-line:#E3E1D9;            /* קו־שיער חם */
  --k-line-2:#D4D1C7;
  --k-line-input:#8C887C;      /* גבול פקד — 3:1 כנדרש */

  /* על כהה */
  --k-on-dark:#C3D2E2;
  --k-on-dark-muted:#93A7BE;
  --k-line-dark:rgba(255,255,255,.14);
  --k-line-dark-2:rgba(255,255,255,.26);

  /* גאומטריה — ריבועית בכוונה */
  --k-r-sm:2px;                /* כפתורים, שדות, תגיות */
  --k-r-md:3px;                /* כרטיסים, תפריטים */
  --k-r-lg:4px;                /* חלונות */

  /* הצללה — כמעט אפס */
  --k-shadow:0 1px 2px rgba(0,18,43,.04);
  --k-shadow-md:0 2px 8px rgba(0,18,43,.07);
  --k-shadow-lg:0 24px 48px -14px rgba(0,18,43,.24);   /* רק לתפריטים ולחלונות */
  --k-focus:0 0 0 2px rgba(10,115,108,.38);

  /* טיפוגרפיה */
  --k-font:'Assistant','Heebo','Noto Sans Hebrew',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --k-font-en:'Inter','Assistant',system-ui,sans-serif;
  --k-micro-ls:.07em;

  --wrap:1180px;
  --gut:clamp(1.1rem,4vw,2rem);
  --pad-section:clamp(3.6rem,8vw,6.5rem);
  --ease:cubic-bezier(.22,1,.36,1);
}

/* ---------- 2. בסיס ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:92px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;
  font-family:var(--k-font);
  font-size:clamp(1rem,.97rem + .18vw,1.06rem);
  line-height:1.75;
  color:var(--k-muted);
  background:var(--k-paper);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
h1,h2,h3,h4{color:var(--k-text);font-weight:800;line-height:1.18;margin:0 0 .5em;letter-spacing:-.018em}
h1{font-size:clamp(2rem,1.3rem + 3.2vw,3.55rem);letter-spacing:-.022em}
h2{font-size:clamp(1.55rem,1.15rem + 1.9vw,2.5rem);letter-spacing:-.02em}
h3{font-size:clamp(1.1rem,1.02rem + .5vw,1.32rem);letter-spacing:-.015em}
h4{font-size:1.02rem;letter-spacing:-.015em}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}
a{color:var(--k-brand);text-decoration:none;transition:color .18s var(--ease)}
a:hover{color:var(--k-acc)}
img,svg,video{max-width:100%;height:auto;display:block}
ul,ol{margin:0 0 1.1em;padding-inline-start:1.3em}
li{margin-bottom:.45em}
strong,b{color:var(--k-text);font-weight:700}
hr{border:0;border-top:1px solid var(--k-line);margin:2.4rem 0}
::selection{background:var(--k-acc);color:#fff}
:focus-visible{outline:2px solid var(--k-acc);outline-offset:2px;border-radius:var(--k-r-sm)}
.ltr{direction:ltr;unicode-bidi:isolate;font-family:var(--k-font-en);font-variant-numeric:tabular-nums}
.num{font-family:var(--k-font-en);font-variant-numeric:tabular-nums}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- 3. פריסה ---------- */
.wrap{width:min(100% - var(--gut)*2,var(--wrap));margin-inline:auto}
.section{padding-block:var(--pad-section)}
.section--tight{padding-block:clamp(2.8rem,5.5vw,4rem)}
.section--surface{background:var(--k-paper-2);border-block:1px solid var(--k-line)}
.section--dark{background:var(--k-night-2);color:var(--k-on-dark)}
.section--dark h2,.section--dark h3,.section--dark h4{color:#fff}
/* רשת קו־שיער: הרווח עצמו הוא הקו המפריד */
.grid{display:grid;gap:1px;background:var(--k-line);border:1px solid var(--k-line)}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
/* עמודות מפורשות — auto-fit יוצר "יתומים" (4+2, 4+1) שנראים כמו באג */
.grid-3{grid-template-columns:1fr}
.grid-4{grid-template-columns:1fr}
@media (min-width:600px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media (min-width:940px){.grid-3{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1040px){.grid-4{grid-template-columns:repeat(4,1fr)}}
.grid--gap{gap:clamp(1rem,2vw,1.35rem);background:none;border:0}
.section--dark .grid{background:var(--k-line-dark);border-color:var(--k-line-dark)}
.center{text-align:center}

/* ---------- 4. ערכת הכותרות ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:.6em;
  font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  color:var(--k-acc);margin-bottom:.9rem;line-height:1.4;
}
.eyebrow::before{content:"";inline-size:14px;block-size:2px;background:var(--k-acc);flex-shrink:0}
.section--dark .eyebrow,.hero .eyebrow,.page-head .eyebrow{color:var(--k-acc-bright)}
.section--dark .eyebrow::before,.hero .eyebrow::before,.page-head .eyebrow::before{background:var(--k-acc-bright)}
.lead{font-size:clamp(1.03rem,1rem + .4vw,1.22rem);line-height:1.7;color:var(--k-muted)}
.section--dark .lead{color:var(--k-on-dark)}
.head{max-width:64ch}
.head.center{margin-inline:auto}
.accent-text{color:var(--k-acc)}
.hero .accent-text,.section--dark .accent-text{color:var(--k-acc-bright)}

/* ---------- 5. כפתורים ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  padding:.78em 1.5em;border-radius:var(--k-r-sm);border:1px solid var(--k-brand);
  font:inherit;font-weight:700;font-size:.98rem;line-height:1.25;
  color:#fff;background:var(--k-brand);cursor:pointer;text-align:center;
  transition:background .18s var(--ease),border-color .18s var(--ease),color .18s var(--ease);
}
.btn:hover{color:#fff;background:var(--k-brand-dark);border-color:var(--k-brand-dark)}
.btn:focus-visible{box-shadow:var(--k-focus)}
.btn .arw{transition:transform .18s var(--ease)}
.btn:hover .arw{transform:translateX(-3px)}
.btn--ghost{background:transparent;border-color:var(--k-line-2);color:var(--k-text)}
.btn--ghost:hover{background:transparent;color:var(--k-acc);border-color:var(--k-acc)}
.btn--on-dark{background:var(--k-paper);border-color:var(--k-paper);color:var(--k-night)}
.btn--on-dark:hover{background:#fff;border-color:#fff;color:var(--k-night)}
.btn--ghost-dark{background:transparent;border-color:var(--k-line-dark-2);color:#fff}
.btn--ghost-dark:hover{background:transparent;color:var(--k-acc-bright);border-color:var(--k-acc-bright)}
.btn--sm{padding:.55em 1.05em;font-size:.88rem}
.btn--block{width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center}
.btn-row.center{justify-content:center}

/* ---------- 6. הדר ---------- */
.skip-link{
  position:absolute;inset-block-start:-100px;inset-inline-start:1rem;z-index:200;
  background:var(--k-night);color:#fff;padding:.7em 1.2em;font-weight:700;
  border-radius:0 0 var(--k-r-sm) var(--k-r-sm);transition:inset-block-start .2s var(--ease);
}
.skip-link:focus{inset-block-start:0;color:#fff}

.site-header{
  position:sticky;inset-block-start:0;z-index:100;
  background:rgba(245,244,239,.92);backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-block-end:1px solid transparent;transition:border-color .25s var(--ease);
}
.site-header.is-stuck{border-block-end-color:var(--k-line-2)}
.nav{display:flex;align-items:center;gap:1.1rem;min-block-size:72px}
.brand{display:flex;align-items:center;flex-shrink:0;margin-inline-end:auto}
.brand img{block-size:34px;inline-size:auto}
.nav-list{display:flex;align-items:center;gap:0;list-style:none;margin:0;padding:0}
.nav-list a{
  display:block;padding:.5em .8em;border-radius:var(--k-r-sm);
  color:var(--k-text);font-weight:600;font-size:.95rem;position:relative;
  transition:color .18s var(--ease);
}
.nav-list a:hover{color:var(--k-acc)}
.nav-list a[aria-current="page"]{color:var(--k-brand)}
.nav-list a[aria-current="page"]::after{
  content:"";position:absolute;inset-block-end:.15em;inset-inline:.8em;
  block-size:2px;background:var(--k-acc);
}
.nav-cta{flex-shrink:0}
.nav-toggle{
  display:none;inline-size:42px;block-size:42px;border:1px solid var(--k-line-2);
  background:transparent;border-radius:var(--k-r-sm);cursor:pointer;padding:0;place-items:center;
}
.nav-toggle span{display:block;inline-size:17px;block-size:1.6px;background:var(--k-text);transition:transform .28s var(--ease),opacity .2s}
.nav-toggle span+span{margin-block-start:4px}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(5.6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.6px) rotate(-45deg)}

/* ה־li הוא list-item כברירת מחדל, והקישור והכפתור הם בלוקים — ולכן
   הצ׳בון נפל לשורה נפרדת מתחת ל״שירותים״ ומתח את כל שורת הניווט. */
.has-sub{position:relative;display:flex;align-items:center}
.sub{
  position:absolute;inset-block-start:calc(100% + 6px);inset-inline-end:0;
  min-inline-size:300px;background:var(--k-card);border:1px solid var(--k-line-2);
  border-radius:var(--k-r-md);box-shadow:var(--k-shadow-lg);padding:.35rem;
  list-style:none;margin:0;opacity:0;visibility:hidden;
  transition:opacity .18s var(--ease),visibility .18s;
}
.has-sub:hover .sub,.has-sub:focus-within .sub{opacity:1;visibility:visible}
.sub a{display:block;padding:.6em .75em;border-radius:var(--k-r-sm);font-weight:700;font-size:.93rem}
.sub a small{display:block;font-weight:400;color:var(--k-muted);font-size:.8rem;line-height:1.5;margin-top:.1em}
.sub a:hover{background:var(--k-acc-soft)}
.sub a:hover small{color:var(--k-muted)}
.caret{transition:transform .2s var(--ease)}
.has-sub:hover .caret{transform:rotate(180deg)}

@media (max-width:960px){
  .nav-toggle{display:grid}
  .nav-cta{display:none}
  .nav-list{
    position:fixed;inset-block-start:72px;inset-inline:0;inset-block-end:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--k-paper);padding:1rem var(--gut) 3rem;overflow-y:auto;
    transform:translateX(100%);opacity:0;visibility:hidden;
    transition:transform .3s var(--ease),opacity .22s var(--ease),visibility .3s;
  }
  .nav-list.is-open{transform:translateX(0);opacity:1;visibility:visible}
  .nav-list a{padding:.85em .5em;font-size:1.05rem;border-block-end:1px solid var(--k-line);border-radius:0}
  .nav-list a[aria-current="page"]::after{display:none}
  .has-sub{flex-wrap:wrap}
  .has-sub>a{flex:1 1 auto}
  .sub{flex-basis:100%;position:static;opacity:1;visibility:visible;box-shadow:none;border:0;
       padding:0 0 .5rem;margin-inline-start:.75rem;border-inline-start:1px solid var(--k-line-2)}
  .sub a{font-size:.95rem;border:0;padding-block:.55em}
  .sub a small{display:none}
  .caret{display:none}
  body.nav-open{overflow:hidden}
}

/* ---------- 7. הירו ---------- */
.hero{
  position:relative;overflow:hidden;isolation:isolate;
  background:var(--k-night);color:var(--k-on-dark);
  padding-block:clamp(3.2rem,7vw,5.5rem) clamp(3.6rem,8vw,6rem);
  border-block-end:1px solid var(--k-line-dark);
}
/* רשת קווים — הפרדה בקו, בלי זוהר */
.hero::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(var(--k-line-dark) 1px,transparent 1px),
                   linear-gradient(90deg,var(--k-line-dark) 1px,transparent 1px);
  background-size:72px 72px;opacity:.45;
}
.hero h1{color:#fff}
.hero .lead{color:var(--k-on-dark);max-width:54ch}
.hero-grid{display:grid;gap:clamp(2rem,4.5vw,3.2rem);align-items:center;grid-template-columns:1fr}
@media (min-width:960px){.hero-grid{grid-template-columns:1.05fr .95fr}}

.badge{
  display:inline-flex;align-items:center;gap:.6em;
  padding:.4em .9em;border-radius:var(--k-r-sm);
  background:transparent;border:1px solid var(--k-line-dark-2);
  color:#D9E5F1;font-size:.75rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  margin-bottom:1.3rem;
}
.badge .dot{inline-size:6px;block-size:6px;background:var(--k-acc-bright);flex-shrink:0}
.hero-note{font-size:.88rem;color:var(--k-on-dark-muted);margin-top:1.1rem}
.hero-note strong{color:#D9E5F1}

.click-panel{
  position:relative;border-radius:var(--k-r-md);padding:1.25rem;
  background:rgba(255,255,255,.03);border:1px solid var(--k-line-dark-2);
}
.click-panel-title{
  display:flex;align-items:center;gap:.6rem;font-size:.719rem;color:var(--k-on-dark-muted);
  margin-bottom:.85rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  padding-block-end:.85rem;border-block-end:1px solid var(--k-line-dark);
}
.click-panel-title .lights{display:flex;gap:4px}
.click-panel-title .lights i{inline-size:6px;block-size:6px;background:var(--k-line-dark-2);display:block}
.click-panel-title .lights i:first-child{background:var(--k-acc-bright)}
.flowline{display:grid;gap:0}
.flownode{
  display:flex;align-items:center;gap:.8rem;padding:.75rem .1rem;
  color:#DCE8F6;font-weight:700;font-size:.92rem;
  opacity:0;transform:translateY(6px);animation:nodeIn .5s var(--ease) forwards;
}
.flowline>*:nth-child(1){animation-delay:.1s}
.flowline>*:nth-child(3){animation-delay:.25s}
.flowline>*:nth-child(5){animation-delay:.4s}
.flowline>*:nth-child(7){animation-delay:.55s}
@keyframes nodeIn{to{opacity:1;transform:translateY(0)}}
.flownode .ic{
  inline-size:34px;block-size:34px;border-radius:var(--k-r-sm);display:grid;place-items:center;
  flex-shrink:0;background:transparent;border:1px solid var(--k-acc-bright);color:var(--k-acc-bright);
}
.flownode small{display:block;font-weight:400;color:var(--k-on-dark-muted);font-size:.78rem;line-height:1.5}
.flownode.is-out .ic{background:var(--k-acc-bright);color:var(--k-night)}
.flowarrow{
  display:grid;place-items:center;block-size:12px;color:var(--k-line-dark-2);
  border-inline-start:1px solid var(--k-line-dark-2);margin-inline-start:17px;
}
.flowarrow svg{display:none}
@media (prefers-reduced-motion:reduce){.flownode{opacity:1;transform:none;animation:none}}

/* ---------- 8. כרטיסים ---------- */
.card{
  position:relative;background:var(--k-card);border:1px solid var(--k-line);
  border-radius:var(--k-r-md);padding:clamp(1.35rem,2.4vw,1.75rem);
  transition:border-color .22s var(--ease);block-size:100%;
}
.card::before{
  content:"";position:absolute;inset-block-start:-1px;inset-inline-start:-1px;
  inline-size:0;block-size:2px;background:var(--k-acc);transition:inline-size .28s var(--ease);
}
.card:hover{border-color:var(--k-line-2)}
.card:hover::before{inline-size:44px}
/* בתוך רשת קו־שיער הכרטיסים נצמדים, והרווח הוא הקו */
.grid:not(.grid--gap)>.card{border:0;border-radius:0}
.grid:not(.grid--gap)>.card::before{inset-block-start:0;inset-inline-start:0}
.card h3{margin-bottom:.4rem}
.card p{color:var(--k-muted);font-size:.96rem;margin-bottom:0}
.card-link{display:block;color:inherit}
.card-link:hover{color:inherit}
.card-icon{
  inline-size:38px;block-size:38px;border-radius:var(--k-r-sm);display:grid;place-items:center;
  background:transparent;border:1px solid var(--k-acc-line);color:var(--k-acc);
  margin-bottom:1rem;transition:border-color .22s var(--ease),background .22s var(--ease);
}
.card:hover .card-icon{border-color:var(--k-acc);background:var(--k-acc-soft)}
.card-num{
  font-family:var(--k-font-en);font-variant-numeric:tabular-nums;
  font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  color:var(--k-acc);margin-bottom:.55rem;display:block;
}
.card-more{margin-top:1rem;font-size:.89rem;font-weight:700;color:var(--k-brand);display:inline-flex;gap:.35em;align-items:center}
.card:hover .card-more{color:var(--k-acc)}
.card-more .arw{transition:transform .18s var(--ease)}
.card:hover .card-more .arw{transform:translateX(-3px)}
.card--dark{background:var(--k-night-2);border-color:var(--k-line-dark)}
.card--dark h3{color:#fff}
.card--dark p{color:var(--k-on-dark)}
.card--dark:hover{border-color:var(--k-acc-bright)}
.card--flat{background:var(--k-card);border-color:var(--k-line)}
.card--flat:hover{border-color:var(--k-line-2)}

.tag-list{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem;padding:0;list-style:none}
.tag-list li{margin:0}
.tag{
  display:inline-block;padding:.28em .7em;border-radius:var(--k-r-sm);
  background:transparent;border:1px solid var(--k-line-2);
  font-size:.79rem;font-weight:600;color:var(--k-muted);
}
.card--dark .tag,.section--dark .tag{border-color:var(--k-line-dark-2);color:var(--k-on-dark)}
/* על משטח כהה, המבטא עובר לגרסה הבהירה */
.section--dark .card-num,.card--dark .card-num,
.section--dark .card-more,.card--dark .card-more,
.section--dark .field .req,.section--dark .accent-text{color:var(--k-acc-bright)}
.section--dark .card-icon,.card--dark .card-icon{border-color:var(--k-acc-bright);color:var(--k-acc-bright)}
.section--dark .card:hover .card-icon,.card--dark:hover .card-icon{background:transparent}

/* ---------- 9. רשימות סימון ---------- */
.checks{list-style:none;padding:0;margin:0;display:grid;gap:.65rem}
.checks li{display:flex;gap:.7rem;align-items:flex-start;margin:0;font-size:.97rem}
.checks li::before{
  content:"";flex-shrink:0;inline-size:16px;block-size:16px;margin-block-start:.32em;
  background:var(--k-acc);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/16px no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/16px no-repeat;
}
.section--dark .checks li::before{background:var(--k-acc-bright)}

/* ---------- 10. שלבים ---------- */
.steps{counter-reset:step;display:grid;gap:0}
@media (min-width:860px){.steps{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}}
.step{position:relative;padding:2.7rem 0 1.4rem;border-block-start:1px solid var(--k-line)}
.section--dark .step{border-block-start-color:var(--k-line-dark)}
@media (min-width:860px){
  .step{padding-inline-end:1.5rem}
  .step+.step{border-inline-start:1px solid var(--k-line);padding-inline-start:1.5rem}
  .section--dark .step+.step{border-inline-start-color:var(--k-line-dark)}
  .step+.step::before{inset-inline-start:1.5rem}
}
.step::before{
  counter-increment:step;content:"0" counter(step);
  position:absolute;inset-block-start:1rem;inset-inline-start:0;
  font-family:var(--k-font-en);font-variant-numeric:tabular-nums;
  font-weight:700;font-size:.719rem;letter-spacing:var(--k-micro-ls);color:var(--k-acc);
}
.section--dark .step::before{color:var(--k-acc-bright)}
.step h3{font-size:1.06rem;margin-bottom:.35rem}
.step p{font-size:.94rem;color:var(--k-muted)}
.section--dark .step p{color:var(--k-on-dark)}
.step-meta{
  font-size:.719rem;color:var(--k-muted);font-weight:700;letter-spacing:var(--k-micro-ls);
  margin-bottom:.3rem;display:block;
}
.section--dark .step-meta{color:var(--k-on-dark-muted)}

/* ---------- 11. מדדים ---------- */
.stats{display:grid;gap:1px;background:var(--k-line-dark);grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr))}
.stat{padding:1.3rem 1.1rem;background:var(--k-night-2)}
.stat b{display:block;font-family:var(--k-font-en);font-variant-numeric:tabular-nums;
  font-size:clamp(1.5rem,1.2rem + 1.2vw,1.95rem);color:#fff;line-height:1.2;font-weight:800;letter-spacing:-.02em}
.stat span{font-size:.85rem;color:var(--k-on-dark-muted)}

/* ---------- 12. אקורדיון ---------- */
.faq{display:grid;gap:0;border-block-start:1px solid var(--k-line)}
.faq details{border-block-end:1px solid var(--k-line);background:transparent}
.faq details[open]{background:var(--k-card)}
.faq summary{
  list-style:none;cursor:pointer;padding:1.05rem .9rem;
  font-weight:700;color:var(--k-text);font-size:1rem;line-height:1.55;
  display:flex;align-items:flex-start;gap:.9rem;transition:color .18s var(--ease);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";flex-shrink:0;margin-inline-start:auto;margin-block-start:.4em;
  inline-size:12px;block-size:12px;background:var(--k-brand);
  transition:transform .25s var(--ease),background .18s var(--ease);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.8' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/12px no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.8' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/12px no-repeat;
}
.faq details[open] summary::after{transform:rotate(180deg);background:var(--k-acc)}
.faq summary:hover{color:var(--k-acc)}
.faq summary:hover::after{background:var(--k-acc)}
.faq .answer{padding:0 .9rem 1.25rem;color:var(--k-muted);font-size:.97rem}

/* ---------- 13. פס קריאה לפעולה ---------- */
.cta-band{
  border-radius:var(--k-r-md);padding:clamp(2rem,4.5vw,3.2rem);text-align:center;
  background:var(--k-night-2);color:var(--k-on-dark);border:1px solid var(--k-night-2);
}
.cta-band h2{color:#fff;margin-bottom:.5rem}
.cta-band p{max-width:52ch;margin-inline:auto;color:var(--k-on-dark)}

/* ---------- 14. טפסים ---------- */
.form{display:grid;gap:1rem}
.field{display:grid;gap:.35rem}
.field label{font-weight:700;color:var(--k-text);font-size:.92rem}
.field .hint{font-size:.82rem;color:var(--k-muted);font-weight:400}
.field .req{color:var(--k-acc)}
.input,.textarea,.select{
  inline-size:100%;font:inherit;font-size:1rem;color:var(--k-text);
  padding:.75em .9em;border:1px solid var(--k-line-input);border-radius:var(--k-r-sm);
  background:var(--k-card);transition:border-color .18s var(--ease),box-shadow .18s var(--ease);
}
.input::placeholder,.textarea::placeholder{color:#8B95A0}
.input:hover,.textarea:hover,.select:hover{border-color:var(--k-text)}
.input:focus,.textarea:focus,.select:focus{outline:none;border-color:var(--k-acc);box-shadow:var(--k-focus)}
.textarea{min-block-size:130px;resize:vertical;line-height:1.65}
.select{appearance:none;padding-inline-end:2.5em;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235C6874' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:left .9em center;background-size:14px;
}
.input[type="tel"],.input[type="email"]{direction:ltr;text-align:right;font-variant-numeric:tabular-nums}
.check-field{display:flex;gap:.6rem;align-items:flex-start;font-size:.91rem;color:var(--k-muted)}
.check-field input{margin-block-start:.28em;inline-size:17px;block-size:17px;accent-color:var(--k-acc);flex-shrink:0}
.chip-group{display:flex;flex-wrap:wrap;gap:.45rem}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inline-size:100%;block-size:100%;inset:0;cursor:pointer;margin:0}
.chip span{
  display:block;padding:.48em 1em;border-radius:var(--k-r-sm);border:1px solid var(--k-line-2);
  background:var(--k-card);font-size:.9rem;font-weight:600;color:var(--k-muted);
  transition:border-color .18s var(--ease),color .18s var(--ease),background .18s var(--ease);cursor:pointer;
}
.chip input:hover+span{border-color:var(--k-text)}
.chip input:checked+span{background:var(--k-acc-soft);border-color:var(--k-acc);color:var(--k-acc-dark)}
.chip input:focus-visible+span{box-shadow:var(--k-focus)}
.form-note{font-size:.83rem;color:var(--k-muted)}
.form-status{padding:.9rem 1.1rem;border-radius:var(--k-r-sm);font-weight:600;font-size:.94rem;display:none}
.form-status.is-ok{display:block;background:var(--k-acc-soft);border:1px solid var(--k-acc);color:var(--k-acc-dark)}
.form-status.is-err{display:block;background:#FBF0EC;border:1px solid #B5652F;color:#8A4A1E}
.honey{position:absolute!important;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0);opacity:0;pointer-events:none}

/* ---------- 15. ערוצי קשר ---------- */
.contact-methods{display:grid;gap:0;border-block-start:1px solid var(--k-line)}
.cmethod{
  display:flex;gap:.9rem;align-items:center;padding:.95rem .5rem;
  border-block-end:1px solid var(--k-line);color:inherit;
  transition:background .2s var(--ease),padding-inline-start .2s var(--ease);
}
.cmethod:hover{color:inherit;background:var(--k-acc-soft);padding-inline-start:.9rem}
.cmethod .ic{
  inline-size:38px;block-size:38px;border-radius:var(--k-r-sm);display:grid;place-items:center;
  flex-shrink:0;background:transparent;border:1px solid var(--k-acc-line);color:var(--k-acc);
  transition:border-color .2s var(--ease);
}
.cmethod:hover .ic{border-color:var(--k-acc)}
.cmethod b{display:block;color:var(--k-text);font-size:.96rem;line-height:1.45}
.cmethod span{font-size:.85rem;color:var(--k-muted)}

/* ---------- 16. פירורי לחם ---------- */
.crumbs{font-size:.84rem;color:var(--k-muted);padding-block:1rem 0}
.crumbs ol{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;margin:0;padding:0;align-items:center}
.crumbs li{margin:0;display:flex;align-items:center;gap:.4rem}
.crumbs li+li::before{content:"\2039";opacity:.55}
.crumbs a{color:inherit;font-weight:600}
.crumbs a:hover{color:var(--k-acc)}
.crumbs [aria-current]{font-weight:600}

/* ---------- 17. כותרת עמוד פנימי ---------- */
.page-head{
  position:relative;overflow:hidden;isolation:isolate;
  background:var(--k-night);color:var(--k-on-dark);
  padding-block:clamp(2rem,4.5vw,2.8rem) clamp(2.8rem,6vw,4.2rem);
  border-block-end:1px solid var(--k-line-dark);
}
.page-head::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(var(--k-line-dark) 1px,transparent 1px),
                   linear-gradient(90deg,var(--k-line-dark) 1px,transparent 1px);
  background-size:72px 72px;opacity:.45;
}
.page-head h1{color:#fff;margin-block-start:.5rem}
.page-head .lead{color:var(--k-on-dark);max-width:62ch}
.page-head .crumbs{color:var(--k-on-dark-muted)}
.page-head .crumbs a:hover{color:var(--k-acc-bright)}

/* ---------- 18. פרוזה (מסמכים) ---------- */
.prose{max-width:74ch;margin-inline:auto;font-size:1rem}
.prose h2{font-size:clamp(1.28rem,1.12rem + .7vw,1.6rem);margin-block:2.4rem .7rem;scroll-margin-top:105px;
  padding-block-start:1.4rem;border-block-start:1px solid var(--k-line)}
.prose h2:first-child{margin-block-start:0;padding-block-start:0;border:0}
.prose h3{font-size:1.08rem;margin-block:1.6rem .45rem}
.prose ul,.prose ol{padding-inline-start:1.3em}
.prose li{margin-bottom:.5em}
.prose a{font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;text-decoration-color:var(--k-acc-line)}
.prose a:hover{text-decoration-color:currentColor}
.prose table{inline-size:100%;border-collapse:collapse;margin-block:1.2rem;font-size:.93rem}
.prose th,.prose td{padding:.65em .85em;border:1px solid var(--k-line);text-align:start}
.prose th{background:var(--k-paper-2);color:var(--k-text);font-weight:700}
.callout{
  padding:1rem 1.2rem;border-radius:var(--k-r-sm);background:var(--k-acc-soft);
  border:1px solid var(--k-acc-line);border-inline-start:2px solid var(--k-acc);
  margin-block:1.4rem;font-size:.94rem;
}
.callout strong{display:block;margin-bottom:.2rem}
.doc-meta{font-size:.84rem;color:var(--k-muted);margin-bottom:1.8rem;padding-bottom:1.1rem;border-bottom:1px solid var(--k-line)}
.toc{border:1px solid var(--k-line);border-radius:var(--k-r-md);padding:1.1rem 1.3rem;margin-bottom:2.2rem;background:var(--k-card)}
.toc b{display:block;margin-bottom:.55rem;font-size:.719rem;font-weight:700;
  letter-spacing:var(--k-micro-ls);color:var(--k-acc)}
.toc ol{margin:0;padding-inline-start:1.2em;font-size:.92rem;columns:2;column-gap:2rem}
@media (max-width:640px){.toc ol{columns:1}}
.toc li{margin-bottom:.28em;break-inside:avoid}
.toc a{display:inline-block;padding-block:.22rem;min-block-size:24px}

/* ---------- 19. פוטר ---------- */
.site-footer{background:var(--k-night);color:var(--k-on-dark-muted);padding-block:clamp(2.8rem,5.5vw,4rem) 1.8rem;font-size:.93rem}
.footer-grid{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));margin-bottom:2.4rem}
.footer-brand{grid-column:1/-1}
@media (min-width:860px){.footer-brand{grid-column:auto;max-inline-size:280px}}
.footer-brand img{block-size:32px;inline-size:auto;margin-bottom:.9rem}
.footer-brand p{font-size:.91rem;color:var(--k-on-dark-muted);line-height:1.7}
.site-footer h2,.footer-h{color:#fff;font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  margin-bottom:.8rem;line-height:1.3;padding-block-end:.7rem;border-block-end:1px solid var(--k-line-dark)}
.footer-h{font-family:inherit}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:.25em}
.site-footer a{color:var(--k-on-dark);font-size:.91rem}
.site-footer li a,.footer-bottom .legal-links a{display:inline-block;padding-block:.28rem;min-block-size:24px}
.site-footer a:hover{color:var(--k-acc-bright)}
.footer-bottom{
  border-block-start:1px solid var(--k-line-dark);padding-block-start:1.4rem;
  display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;align-items:center;justify-content:space-between;
  font-size:.84rem;color:var(--k-on-dark-muted);
}
.footer-bottom .legal-links{display:flex;flex-wrap:wrap;gap:.3rem 1.2rem}
.footer-social{display:flex;gap:.5rem;margin-top:1.2rem}
.footer-social a{
  inline-size:36px;block-size:36px;border-radius:var(--k-r-sm);display:grid;place-items:center;
  background:transparent;border:1px solid var(--k-line-dark-2);color:var(--k-on-dark);
  transition:border-color .2s var(--ease),color .2s var(--ease);padding:0;
}
.footer-social a:hover{border-color:var(--k-acc-bright);color:var(--k-acc-bright)}

/* ---------- 20. וואטסאפ צף ---------- */
.wa-float{
  position:fixed;inset-block-end:20px;inset-inline-start:20px;z-index:90;
  display:flex;align-items:center;gap:.55rem;
  padding:.7rem 1.05rem;border-radius:var(--k-r-sm);
  background:var(--k-night);border:1px solid var(--k-acc-bright);
  color:var(--k-acc-bright);font-weight:700;font-size:.9rem;
  transition:background .2s var(--ease),color .2s var(--ease),opacity .3s,transform .3s var(--ease);
  opacity:0;transform:translateY(10px);pointer-events:none;
}
.wa-float.is-visible{opacity:1;transform:translateY(0);pointer-events:auto}
/* סרגל ה־Cookie הוא z-index 120 והכפתור 90 — בלי זה הוא מכסה את נקודת
   ההמרה המהירה ביותר באתר בדיוק בכניסה הראשונה במובייל. */
body.cookie-open .wa-float{inset-block-end:calc(20px + var(--cookie-h, 104px))}
@media (max-width:520px){body.cookie-open .wa-float{inset-block-end:calc(16px + var(--cookie-h, 132px))}}
.wa-float:hover{background:var(--k-acc-bright);color:var(--k-night)}
@media (max-width:520px){.wa-float span{display:none}.wa-float{padding:.8rem;inset-block-end:16px;inset-inline-start:16px}}

/* ---------- 21. הודעת Cookie ---------- */
.cookie-bar{
  position:fixed;inset-block-end:0;inset-inline:0;z-index:120;
  background:var(--k-card);border-block-start:1px solid var(--k-line-2);
  box-shadow:var(--k-shadow-lg);
  padding:1rem var(--gut);transform:translateY(110%);transition:transform .4s var(--ease);
}
.cookie-bar.is-visible{transform:translateY(0)}
.cookie-inner{
  width:min(100%,var(--wrap));margin-inline:auto;
  display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;
}
.cookie-bar p{font-size:.88rem;margin:0;max-width:62ch;color:var(--k-muted)}
.cookie-actions{display:flex;gap:.5rem;flex-wrap:wrap}

/* ---------- 22. חשיפה בגלילה ---------- */
.reveal{opacity:0;transform:translateY(12px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* ---------- 23. שונות ---------- */
.split{display:grid;gap:clamp(2rem,4.5vw,3.2rem);align-items:start;grid-template-columns:1fr}
@media (min-width:900px){.split{grid-template-columns:1fr 1fr}.split--wide{grid-template-columns:1.1fr .9fr}}
.compare{display:grid;gap:1px;background:var(--k-line);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,255px),1fr));
  border:1px solid var(--k-line);border-radius:var(--k-r-md);overflow:hidden}
.compare-col{padding:1.4rem;background:var(--k-card)}
.compare-col.is-good{background:var(--k-acc-soft)}
.compare-col h3{font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  color:var(--k-muted);margin-bottom:.95rem;padding-block-end:.7rem;border-block-end:1px solid var(--k-line)}
.compare-col.is-good h3{color:var(--k-acc-dark);border-block-end-color:var(--k-acc-line)}
.compare-col ul{list-style:none;padding:0;margin:0;display:grid;gap:.6rem;font-size:.93rem}
.compare-col li{margin:0;padding-inline-start:1.4em;position:relative}
.compare-col li::before{content:"\2715";position:absolute;inset-inline-start:0;color:#8A4A1E;font-weight:700;font-size:.85em}
.compare-col.is-good li::before{content:"\2713";color:var(--k-acc)}
.big-quote{
  font-size:clamp(1.2rem,1.02rem + .9vw,1.6rem);line-height:1.55;font-weight:700;color:var(--k-text);
  letter-spacing:-.02em;padding-inline-start:1.2rem;border-inline-start:2px solid var(--k-acc);
}
.section--dark .big-quote{color:#fff;border-inline-start-color:var(--k-acc-bright)}
.err-code{
  font-family:var(--k-font-en);font-variant-numeric:tabular-nums;
  font-size:clamp(3.5rem,2.6rem + 7vw,7.5rem);font-weight:800;line-height:1;
  letter-spacing:-.04em;margin-bottom:.4rem;color:var(--k-acc-bright);
}

/* ==========================================================================
   24. מפתח שירותים — שורות עורכיות במקום רשת כרטיסים.
   רשת כרטיסים היא ברירת המחדל של כולם. אינדקס ממוספר הוא מסמך.
   ========================================================================== */
.index{list-style:none;margin:0;padding:0;border-block-start:1px solid var(--k-line-2)}
.index li{margin:0}
.index-row{
  position:relative;display:grid;align-items:start;gap:.5rem 1rem;
  grid-template-columns:auto minmax(0,1fr);
  grid-template-areas:"num title" ". desc";
  padding:1.4rem .2rem;border-block-end:1px solid var(--k-line);
  color:inherit;transition:background .22s var(--ease),padding-inline-start .22s var(--ease);
}
.index-num{grid-area:num}
.index-title{grid-area:title}
.index-desc{grid-area:desc}
.index-go{grid-area:go}
@media (min-width:880px){
  .index-row{
    grid-template-columns:2.6rem minmax(240px,300px) minmax(0,1fr) auto;
    grid-template-areas:"num title desc go";
    align-items:center;gap:1.6rem;padding-block:1.5rem;
  }
}
/* מקף המבטא שנפתח בקצה המוביל */
.index-row::before{
  content:"";position:absolute;inset-block:0;inset-inline-start:0;
  inline-size:2px;background:var(--k-acc);transform:scaleY(0);transform-origin:top;
  transition:transform .26s var(--ease);
}
.index-row:hover{background:var(--k-card);padding-inline-start:1.1rem;color:inherit}
.index-row:hover::before{transform:scaleY(1)}
.index-num{
  font-family:var(--k-font-en);font-variant-numeric:tabular-nums;
  font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  color:var(--k-muted);transition:color .22s var(--ease);padding-block-start:.35rem;
}
.index-row:hover .index-num{color:var(--k-acc)}
.index-title{display:flex;align-items:center;gap:.85rem}
.index-title h3{margin:0;font-size:clamp(1.15rem,1.02rem + .55vw,1.4rem)}
.index-ic{
  inline-size:34px;block-size:34px;border-radius:var(--k-r-sm);display:grid;place-items:center;
  flex-shrink:0;border:1px solid var(--k-acc-line);color:var(--k-acc);
  transition:border-color .22s var(--ease),background .22s var(--ease);
}
.index-row:hover .index-ic{border-color:var(--k-acc);background:var(--k-acc-soft)}
.index-desc{font-size:.95rem;color:var(--k-muted);margin:0;max-width:56ch}
.index-go{
  display:none;font-size:.85rem;font-weight:700;color:var(--k-brand);
  align-items:center;gap:.35em;white-space:nowrap;
}
@media (min-width:880px){.index-go{display:inline-flex}}
.index-row:hover .index-go{color:var(--k-acc)}
.index-go .arw{transition:transform .2s var(--ease)}
.index-row:hover .index-go .arw{transform:translateX(-4px)}

/* ==========================================================================
   25. סימני פינה — מוטיב החתימה. סימני יישור, כמו על גיליון שרטוט.
   ========================================================================== */
.ticked{position:relative}
.ticked::before,.ticked::after{
  content:"";position:absolute;inline-size:11px;block-size:11px;pointer-events:none;
  border-color:var(--k-acc);border-style:solid;border-width:0;
}
.ticked::before{
  inset-block-start:-1px;inset-inline-start:-1px;
  border-block-start-width:2px;border-inline-start-width:2px;
}
.ticked::after{
  inset-block-end:-1px;inset-inline-end:-1px;
  border-block-end-width:2px;border-inline-end-width:2px;
}
.ticked--bright::before,.ticked--bright::after{border-color:var(--k-acc-bright)}

/* ==========================================================================
   26. כותרת מדור עם פס — הכותרת יושבת על קו שחוצה את הרוחב
   ========================================================================== */
.rule-head{
  display:grid;gap:1.4rem;align-items:end;grid-template-columns:1fr;
  padding-block-end:1.4rem;border-block-end:1px solid var(--k-line-2);margin-block-end:0;
}
@media (min-width:900px){.rule-head{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}}
.rule-head h2{margin:0}
.rule-head .lead{margin:0}
.section--dark .rule-head{border-block-end-color:var(--k-line-dark-2)}

/* ==========================================================================
   27. תיקוני פריסה
   ========================================================================== */
/* עמודות בגובה שונה לא משאירות חלל — הן נמתחות */
.split--stretch{align-items:stretch}
/* טבלת ההשוואה: שתי עמודות זו לצד זו, לא זו מעל זו */
.compare--pair{grid-template-columns:1fr}
@media (min-width:560px){.compare--pair{grid-template-columns:1fr 1fr}}

/* ---------- 25. כפתור חשיפת תת־תפריט ---------- */
/* הקישור מוביל לעמוד הריכוז, הכפתור פותח את הרשימה. שני דברים שונים,
   ולכן שתי נקודות מגע נפרדות — גם לעכבר, גם למקלדת, גם לקורא מסך. */
.sub-toggle{
  display:inline-grid;place-items:center;
  inline-size:28px;block-size:28px;margin-inline-start:-.5em;
  padding:0;border:0;background:transparent;cursor:pointer;
  color:var(--k-text);border-radius:var(--k-r-sm);
}
.sub-toggle:hover{color:var(--k-acc)}
.sub-toggle:focus-visible{box-shadow:var(--k-focus)}
.has-sub:hover .sub,
.has-sub:focus-within .sub,
.sub-toggle[aria-expanded="true"]~.sub{opacity:1;visibility:visible}
.sub-toggle[aria-expanded="true"] .caret{transform:rotate(180deg)}

/* ---------- 26. תקציר נקודות (TL;DR) ---------- */
/* המבנה הזה הוא מה שמנוע תשובות שולף ממנו — ומה שגולש מחיפוש קורא ראשון. */
.tldr{
  border:1px solid var(--k-line-2);border-inline-start:2px solid var(--k-acc);
  background:var(--k-card);padding:1.3rem 1.5rem;max-inline-size:74ch;margin-inline:auto;
}
.tldr-h{
  font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  color:var(--k-acc);margin:0 0 .8rem;
}
.tldr ul{margin:0;padding:0;list-style:none;display:grid;gap:.55rem}
.tldr li{position:relative;padding-inline-start:1.1rem;line-height:1.65}
.tldr li::before{
  content:"";position:absolute;inset-inline-start:0;inset-block-start:.62em;
  inline-size:5px;block-size:5px;background:var(--k-acc);
}

/* ---------- 27. טבלת השוואה ---------- */
.table-scroll{overflow-x:auto;border:1px solid var(--k-line-2);background:var(--k-card)}
.ctable{border-collapse:collapse;inline-size:100%;min-inline-size:560px;font-size:.94rem}
.ctable caption{
  caption-side:top;text-align:start;padding:1rem 1.1rem .8rem;
  font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);color:var(--k-muted);
  border-block-end:1px solid var(--k-line);
}
.ctable th,.ctable td{
  padding:.8rem 1.1rem;text-align:start;vertical-align:top;
  border-block-end:1px solid var(--k-line);
}
.ctable thead th{background:var(--k-paper-2);font-weight:700;color:var(--k-text);white-space:nowrap}
.ctable tbody th{font-weight:700;color:var(--k-text);background:var(--k-paper);inline-size:9rem}
.ctable td{color:var(--k-muted)}
.ctable tbody tr:last-child th,.ctable tbody tr:last-child td{border-block-end:0}

/* ---------- 28. שורת אמון בתחתית צור קשר ---------- */
.trust-row{
  list-style:none;margin:0;padding:0;
  display:grid;gap:1.2rem;grid-template-columns:1fr;
}
@media (min-width:820px){.trust-row{grid-template-columns:repeat(3,1fr)}}
.trust-row li{display:flex;gap:.7rem;align-items:flex-start;color:var(--k-muted);font-size:.93rem;line-height:1.6}
.trust-row svg{flex-shrink:0;color:var(--k-acc);margin-block-start:.15em}
.trust-note{margin-block-start:1.6rem;font-size:.93rem;color:var(--k-muted)}

/* ---------- 29. כרטיס אדם ---------- */
.person-role{
  font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  color:var(--k-acc);margin:.2rem 0 .7rem;
}
.card img[src*="team-"]{
  inline-size:72px;block-size:72px;object-fit:cover;
  border-radius:var(--k-r-sm);margin-bottom:.9rem;
}

/* ---------- 30. מצב ניגודיות כפויה (Windows High Contrast) ---------- */
/* המערכת מחליפה את כל הצבעים שלנו. מה שמפריד באתר הזה הוא קו — ולכן צריך
   לוודא שהקווים שורדים, ושהמבטא הופך למערכתי במקום להיעלם. */
@media (forced-colors: active){
  .btn,.card,.tldr,.table-scroll,.input,.textarea,.chip span,.cookie-bar,
  .sub,.index-row,.step,.compare-col{border:1px solid CanvasText}
  .btn{forced-color-adjust:none;background:ButtonFace;color:ButtonText;border-color:ButtonText}
  .wa-float{background:Canvas;color:LinkText;border:1px solid LinkText}
  .tldr li::before{background:CanvasText}
  :focus-visible{outline:2px solid Highlight;outline-offset:2px}
  .hero::before{display:none}
}

/* ==========================================================================
   31. תנועה — הקו הוא הגיבור

   העיקרון: הקו לא "מופיע" — הוא נמתח. כל תנועה באתר הזה היא קו שנמשך,
   פולס שנע לאורך חוט, או סימן פינה שנסגר. אין ריחוף, אין קפיצות, אין
   צללים שנעים. תנועה = מידע בתנועה.
   ========================================================================== */

/* --- 31.1 פס התקדמות גלילה בהדר --- */
/* קו־שיער טורקיז לאורך התחתית של ההדר. משתנה --k-progress נקבע ב־JS. */
.site-header::after{
  content:"";position:absolute;inset-block-end:-1px;inset-inline:0;
  block-size:2px;background:var(--k-acc);
  transform:scaleX(var(--k-progress,0));transform-origin:right center;
  opacity:0;transition:opacity .3s var(--ease);
  pointer-events:none;
}
.site-header.is-stuck::after{opacity:1}
:where(html[dir="ltr"]) .site-header::after{transform-origin:left center}

/* --- 31.2 קו חי בניווט --- */
.nav-list a::before{
  content:"";position:absolute;inset-block-end:.15em;inset-inline-start:.8em;
  inline-size:0;block-size:2px;background:var(--k-acc);
  transition:inline-size .26s var(--ease);
}
.nav-list a:hover::before,.nav-list a:focus-visible::before{inline-size:calc(100% - 1.6em)}
.nav-list a[aria-current="page"]::before{content:none}

/* --- 31.3 הקו של ה־eyebrow נמתח כשהמדור נחשף --- */
.reveal .eyebrow::before{inline-size:0;transition:inline-size .55s .12s var(--ease)}
.reveal.is-in .eyebrow::before{inline-size:14px}

/* --- 31.4 כרטיס: סימני פינה נסגרים בריחוף --- */
/* אותו מוטיב של .ticked, רק שהוא נבנה מתחת לאצבע. */
.card::after{
  content:"";position:absolute;inset-block-end:-1px;inset-inline-end:-1px;
  inline-size:0;block-size:0;pointer-events:none;
  border-color:var(--k-acc);border-style:solid;border-width:0;
  border-block-end-width:2px;border-inline-end-width:2px;
  transition:inline-size .3s .05s var(--ease),block-size .3s .05s var(--ease);
}
.card:hover::after,.card:focus-within::after{inline-size:13px;block-size:13px}
.card:hover::before,.card:focus-within::before{inline-size:60px}
.card--dark::after,.section--dark .card::after{border-color:var(--k-acc-bright)}
/* בתוך רשת קו־שיער אין מרווח שלילי */
.grid:not(.grid--gap)>.card::after{inset-block-end:0;inset-inline-end:0}

/* --- 31.5 שורות האינדקס: קו שנמתח לרוחב --- */
.index-row::after{
  content:"";position:absolute;inset-block-end:-1px;inset-inline-start:0;
  inline-size:0;block-size:1px;background:var(--k-acc);
  transition:inline-size .4s var(--ease);
}
.index-row:hover::after,.index-row:focus-visible::after{inline-size:100%}

/* ==========================================================================
   31.6 הירו — כוריאוגרפיית כניסה
   סדר הכניסה הוא סדר הקריאה: תג, כותרת, הבטחה, פעולה. הפאנל נכנס אחרון,
   כי הוא ההוכחה — ומגיע אחרי שהובטח משהו.
   ========================================================================== */
.hero-circuit{
  position:absolute;inset:0;z-index:-1;pointer-events:none;
  inline-size:100%;block-size:100%;opacity:0;
  transition:opacity 1.2s var(--ease);
}
.hero-circuit.is-live{opacity:1}

@media (prefers-reduced-motion:no-preference){
  /* הרשת נמתחת פנימה */
  .hero::before{animation:gridIn 1.4s var(--ease) both}
  @keyframes gridIn{
    from{opacity:0;transform:scale(1.05)}
    to{opacity:.45;transform:none}
  }

  /* קו סריקה יחיד שיורד על הירו פעם אחת — חתימת הפתיחה */
  .hero::after{
    content:"";position:absolute;inset-inline:0;inset-block-start:0;z-index:0;
    block-size:1px;pointer-events:none;
    background:linear-gradient(90deg,transparent,var(--k-acc-bright),transparent);
    animation:scanOnce 1.5s .15s var(--ease) both;
  }
  @keyframes scanOnce{
    0%{opacity:0;transform:translateY(0)}
    12%{opacity:.85}
    88%{opacity:.5}
    100%{opacity:0;transform:translateY(var(--hero-h,100vh))}
  }

  /* הטקסט עולה מתחת לקו — חיתוך, לא רק שקיפות */
  .hero-grid>div>*{animation:riseIn .7s var(--ease) both}
  .hero .badge{animation-delay:.18s}
  .hero h1{animation:headlineIn .85s .28s var(--ease) both}
  .hero .lead{animation-delay:.46s}
  .hero .btn-row{animation-delay:.58s}
  .hero-note{animation-delay:.68s}
  .hero .click-panel{animation:panelIn .8s .5s var(--ease) both}

  @keyframes riseIn{
    from{opacity:0;transform:translateY(14px)}
    to{opacity:1;transform:none}
  }
  @keyframes headlineIn{
    from{opacity:0;transform:translateY(24px);clip-path:inset(0 0 100% 0)}
    to{opacity:1;transform:none;clip-path:inset(0 0 -20% 0)}
  }
  @keyframes panelIn{
    from{opacity:0;transform:translateY(20px);clip-path:inset(0 0 0 100%)}
    to{opacity:1;transform:none;clip-path:inset(0 0 0 0)}
  }

  /* הפאנל בהירו כבר מתוזמן כאן — אין צורך גם ב־reveal */
  .hero .click-panel.reveal{opacity:1;transform:none}

  /* נקודות הזרימה נכנסות אחרי הפאנל */
  .flowline>*:nth-child(1){animation-delay:.72s}
  .flowline>*:nth-child(3){animation-delay:.84s}
  .flowline>*:nth-child(5){animation-delay:.96s}
  .flowline>*:nth-child(7){animation-delay:1.08s}
}

/* ==========================================================================
   31.7 פאנל הזרימה חי — פולס שנע לאורך החוט, שוב ושוב.
   התרחיש בפאנל הוא מה שאנחנו מוכרים. אז שירוץ, לא שיצויר.
   כל האלמנטים חולקים מחזור של 5.2 שניות; ההיסט נעשה בהשהיה שלילית,
   כדי שהרצף יישאר מסונכרן לנצח ולא ייסחף בין איטרציות.
   ========================================================================== */
.flowarrow{position:relative;overflow:visible}
.flowarrow::after{
  content:"";position:absolute;inset-block-start:0;inset-inline-start:-1px;
  inline-size:2px;block-size:100%;background:var(--k-acc-bright);
  transform-origin:top center;transform:scaleY(0);opacity:0;
}
.flownode .ic{transition:none}

@media (prefers-reduced-motion:no-preference){
  .flowarrow::after{animation:wireFlow 5.2s linear infinite}
  .flownode .ic{animation:icPulse 5.2s linear infinite}

  /* היסטים שליליים = פאזה קבועה בתוך המחזור */
  .flowline>*:nth-child(1) .ic{animation-delay:0s}
  .flowline>*:nth-child(2)::after{animation-delay:-4.8s}
  .flowline>*:nth-child(3) .ic{animation-delay:-4.3s}
  .flowline>*:nth-child(4)::after{animation-delay:-3.9s}
  .flowline>*:nth-child(5) .ic{animation-delay:-3.4s}
  .flowline>*:nth-child(6)::after{animation-delay:-3.0s}
  .flowline>*:nth-child(7) .ic{animation-delay:-2.5s}

  @keyframes wireFlow{
    0%{transform:scaleY(0);opacity:0}
    2%{opacity:1}
    9%{transform:scaleY(1);opacity:1}
    17%{transform:scaleY(1);opacity:0}
    100%{transform:scaleY(1);opacity:0}
  }
  @keyframes icPulse{
    0%,100%{box-shadow:0 0 0 0 rgba(76,220,203,0)}
    3%{box-shadow:0 0 0 3px rgba(76,220,203,.22)}
    11%{box-shadow:0 0 0 7px rgba(76,220,203,0)}
  }
}
@media (prefers-reduced-motion:reduce){
  .flowarrow::after,.flownode .ic,.hero-circuit{animation:none!important;display:none}
  .hero::after{display:none}
}

/* ==========================================================================
   31.8 חשיפה בגלילה — כיוונית, לא רק "למעלה"
   ========================================================================== */
.reveal--start{transform:translate3d(18px,0,0)}   /* RTL: נכנס מהצד הפנימי */
.reveal--start.is-in{transform:none}
.reveal--line{opacity:1;transform:none;clip-path:inset(0 100% 0 0);transition:clip-path .8s var(--ease)}
.reveal--line.is-in{clip-path:inset(0 0 0 0)}
@media (prefers-reduced-motion:reduce){
  .reveal--line{clip-path:none;transition:none}
}

/* ==========================================================================
   32. עמודה צרה — הכותרת והתוכן חולקים אותו רוחב, ממורכז.
   בעברית, בלוק תחום בלי margin auto נצמד לשוליים הימניים ומשאיר חור
   בצד שמאל. זה נראה כמו באג, גם כשזה היה בכוונה.
   ========================================================================== */
.wrap--narrow{max-inline-size:880px}

/* ==========================================================================
   33. הסלוגן — חתימה, לא כותרת. מופיע בקו־שיער, כמו כל השאר.
   ========================================================================== */
.brand-lockup{display:flex;align-items:center;gap:.85rem;margin-inline-end:auto;min-inline-size:0}
.brand{margin-inline-end:0}
.brand-slogan{
  display:none;align-items:center;gap:.55em;white-space:nowrap;
  font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  color:var(--k-muted);padding-inline-start:.85rem;
  border-inline-start:1px solid var(--k-line-2);
}
@media (min-width:1080px){.brand-slogan{display:inline-flex}}
.footer-slogan{
  font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  color:var(--k-acc-bright);margin:.1rem 0 .9rem;
  display:inline-flex;align-items:center;gap:.6em;
}
.footer-slogan::before{content:"";inline-size:14px;block-size:2px;background:var(--k-acc-bright)}

/* פס חתימה — מסמן מעבר בין פרקים בעמוד. הקו נמשך משני הצדדים אל הסלוגן. */
.signature{
  display:flex;align-items:center;gap:clamp(1rem,3vw,2rem);
  padding-block:clamp(2rem,4vw,2.8rem);
}
.signature::before,.signature::after{content:"";flex:1;block-size:1px;background:var(--k-line-2)}
.signature span{
  font-size:clamp(.82rem,.78rem + .2vw,.95rem);font-weight:800;
  letter-spacing:var(--k-micro-ls);color:var(--k-brand);
  white-space:nowrap;display:inline-flex;align-items:center;gap:.6em;
}
.signature i{
  inline-size:6px;block-size:6px;background:var(--k-acc);display:block;flex-shrink:0;
}
.section--dark .signature span{color:#fff}
.section--dark .signature i{background:var(--k-acc-bright)}
.section--dark .signature::before,.section--dark .signature::after{background:var(--k-line-dark-2)}

/* ==========================================================================
   34. ניוזלטר בפוטר
   ========================================================================== */
.news{
  position:relative;
  display:grid;gap:clamp(1.4rem,3vw,2.5rem);align-items:center;
  grid-template-columns:1fr;
  padding:clamp(1.5rem,3vw,2.2rem);
  border:1px solid var(--k-line-dark-2);border-radius:var(--k-r-md);
  background:rgba(255,255,255,.03);
  margin-block-end:clamp(2.4rem,5vw,3.5rem);
}
@media (min-width:900px){.news{grid-template-columns:1fr minmax(340px,.85fr)}}
.news h2{font-size:clamp(1.15rem,1.02rem + .6vw,1.5rem);margin-bottom:.5rem;color:#fff}
.news p{color:var(--k-on-dark);font-size:.94rem;margin:0}
.news-row{display:flex;gap:.6rem;flex-wrap:wrap}
.news-row .input{flex:1 1 200px;min-inline-size:0}
.news-row .btn{flex-shrink:0}
.news .input{
  background:rgba(255,255,255,.06);border-color:var(--k-line-dark-2);color:#fff;
}
.news .input::placeholder{color:#7E9AB9}
.news .input:focus{border-color:var(--k-acc-bright);background:rgba(255,255,255,.09)}
.news-note{margin-block-start:.8rem!important;font-size:.78rem!important;color:var(--k-on-dark-muted)!important;line-height:1.6}
.news-note a{color:var(--k-acc-bright);text-decoration:underline;text-underline-offset:2px}
.news .form-status{margin-block-start:.7rem;font-size:.88rem}
.news .form-status.is-ok{color:var(--k-acc-bright)}
.news .form-status.is-err{color:#FFB4A2}

/* ==========================================================================
   35. עמוד עבודות — תיק, לא גלריה
   ========================================================================== */
.case{display:grid;gap:clamp(1.5rem,3.5vw,2.6rem);grid-template-columns:1fr;align-items:start}
@media (min-width:940px){.case{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}}
.case-main h3{
  font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  color:var(--k-acc);margin-bottom:.7rem;
}
.case-main p{color:var(--k-muted)}
.case-h{
  font-size:.719rem;font-weight:700;letter-spacing:var(--k-micro-ls);
  color:var(--k-muted);margin-bottom:.5rem;
}
.case-side .card p:not(.case-h){font-size:.94rem}
.case-side .btn{margin-block-start:1.1rem}
.tags{display:flex;flex-wrap:wrap;gap:.4rem}
.ticklist{list-style:none;margin:0;padding:0;display:grid;gap:.65rem}
.ticklist li{
  margin:0;padding-inline-start:1.6em;position:relative;
  font-size:.96rem;color:var(--k-muted);line-height:1.65;
}
.ticklist li::before{
  content:"";position:absolute;inset-inline-start:0;inset-block-start:.62em;
  inline-size:9px;block-size:1px;background:var(--k-acc);
}

/* ==========================================================================
   36. עוד תנועה בגלילה — בכל העמודים, ובמידה.
   שלוש דרגות בלבד: קו שנמשך, כרטיס שעולה, מספר שנדלק. שום דבר מסתובב,
   שום דבר קופץ, ושום דבר שזז יותר מ־18 פיקסלים.
   ========================================================================== */

/* פריטים ברשת/רשימה נכנסים בזה אחר זה. ההשהיה נקבעת ב־JS לפי מיקום. */
.reveal-group>*{
  opacity:0;transform:translateY(14px);
  transition:opacity .55s var(--ease),transform .55s var(--ease);
  transition-delay:var(--d,0ms);
}
.reveal-group.is-in>*{opacity:1;transform:none}

/* שורות האינדקס: הקו התחתון נמשך מהשוליים פנימה כשהשורה נחשפת */
.index-row::before{
  content:"";position:absolute;inset-block-end:-1px;inset-inline-start:0;
  block-size:1px;background:var(--k-line-2);
  inline-size:0;transition:inline-size .7s var(--ease);transition-delay:var(--d,0ms);
}
.reveal-group.is-in .index-row::before{inline-size:100%}

/* המספר הגדול נדלק אחרי שהשורה כבר שם */
.index-num,.step-num{transition:color .5s var(--ease) .25s}

@media (prefers-reduced-motion:reduce){
  .reveal-group>*{opacity:1;transform:none;transition:none}
  .index-row::before{inline-size:100%;transition:none}
}

/* ==========================================================================
   37. כותרת עמוד פנימי — אותה כוריאוגרפיה, חצי מהעוצמה.

   עמוד פנימי הוא לא הופעה. הגולש כבר בחר להיכנס, והוא רוצה להתחיל לקרוא —
   ולכן הרצף כאן קצר יותר, שקט יותר ונגמר לפני שהעין הספיקה לחכות לו.
   ========================================================================== */
@media (prefers-reduced-motion:no-preference){
  .page-head::before{animation:gridIn 1.1s var(--ease) both}

  /* קו סריקה יחיד, חלש מזה של הירו */
  .page-head::after{
    content:"";position:absolute;inset-inline:0;inset-block-start:0;z-index:0;
    block-size:1px;pointer-events:none;opacity:0;
    background:linear-gradient(90deg,transparent,var(--k-acc-bright),transparent);
    animation:scanOnce 1.1s .1s var(--ease) both;
  }

  .page-head .crumbs{animation:riseIn .55s .08s var(--ease) both}
  .page-head .eyebrow{animation:riseIn .55s .16s var(--ease) both}
  .page-head h1{animation:headlineIn .7s .24s var(--ease) both}
  .page-head .lead{animation:riseIn .6s .4s var(--ease) both}
}
@media (prefers-reduced-motion:reduce){
  .page-head::after{display:none}
}

/* ==========================================================================
   38. משטחים כהים פנימיים — הקו נכנס לפני התוכן.

   בכל מקטע כהה יש כבר קו מפריד. במקום להנפיש את התוכן שמעליו, מנפישים את
   הקו עצמו: הוא נמתח לרוחב, והתוכן פשוט מופיע אחריו.
   ========================================================================== */
.rule-head{position:relative}
.rule-head::after{
  content:"";position:absolute;inset-block-end:-1px;inset-inline-start:0;
  block-size:1px;background:var(--k-acc);inline-size:0;
  transition:inline-size .9s .1s var(--ease);
}
.rule-head.is-in::after{inline-size:100%}
.section--dark .rule-head::after{background:var(--k-acc-bright)}

/* פס ה־CTA: סימני הפינה נסגרים כשהוא נכנס למסך */
.cta-band.ticked::before,.cta-band.ticked::after{
  inline-size:0;block-size:0;
  transition:inline-size .5s .25s var(--ease),block-size .5s .25s var(--ease);
}
.cta-band.ticked.is-in::before,.cta-band.ticked.is-in::after{inline-size:11px;block-size:11px}

@media (prefers-reduced-motion:reduce){
  .rule-head::after{inline-size:100%;transition:none}
  .cta-band.ticked::before,.cta-band.ticked::after{inline-size:11px;block-size:11px;transition:none}
}

/* ==========================================================================
   37. עמוד המוצר — מערכת חדשות והפצה  (/news-platform/)

   שני רכיבים שקיימים רק כאן: הדמיית הודעת וואטסאפ והדמיית כרטיס השיתוף.
   שניהם מצייתים לאותם שלושה עקרונות — פינות של 2–3 פיקסלים, הפרדה בקו,
   והטורקיז רק כמבטא. אין כאן ירוק של וואטסאפ ואין צבע חדש במערכת.
   ========================================================================== */

/* מפזר: הזנה אחת ← ארבעה יעדים. יושב על ההירו הכהה. */
.fanout{display:grid;gap:0}
.fanout-src{
  display:flex;align-items:center;gap:.8rem;padding:.85rem .1rem;
  color:#DCE8F6;font-weight:700;font-size:.92rem;
}
.fanout-src .ic{
  inline-size:34px;block-size:34px;border-radius:var(--k-r-sm);display:grid;place-items:center;
  flex-shrink:0;background:var(--k-acc-bright);color:var(--k-night);
}
.fanout-src small{display:block;font-weight:400;color:var(--k-on-dark-muted);font-size:.78rem;line-height:1.5}
.fanout-stem{
  block-size:14px;margin-inline-start:17px;border-inline-start:1px solid var(--k-line-dark-2);
}
.fanout-dests{
  display:grid;gap:1px;background:var(--k-line-dark);
  border:1px solid var(--k-line-dark);border-radius:var(--k-r-sm);
  grid-template-columns:repeat(2,1fr);
}
.fanout-dests div{padding:.7rem .8rem;background:var(--k-night-2)}
.fanout-dests b{display:block;color:#fff;font-size:.87rem;font-weight:700;line-height:1.4}
.fanout-dests i{
  font-style:normal;font-family:var(--k-font-en);font-size:.72rem;
  color:var(--k-on-dark-muted);letter-spacing:.02em;
}

/* שתי ההדמיות זו לצד זו */
.mocks{display:grid;gap:clamp(1.6rem,4vw,2.6rem);grid-template-columns:1fr}
@media (min-width:880px){.mocks{grid-template-columns:1fr 1fr}}
.mock-label{
  display:block;font-family:var(--k-font-en);font-size:.719rem;font-weight:700;
  letter-spacing:var(--k-micro-ls);color:var(--k-acc);margin-bottom:.7rem;
}
.mock-note{font-size:.88rem;color:var(--k-muted);margin-block-start:.9rem}

/* הדמיה א׳ — הודעה מאוגדת בקבוצה */
.bubble{
  background:var(--k-card);border:1px solid var(--k-line);border-radius:var(--k-r-md);
  padding:1.1rem 1.2rem;position:relative;
}
.bubble .stamp{
  display:inline-block;font-family:var(--k-font-en);font-size:.7rem;font-weight:700;
  letter-spacing:var(--k-micro-ls);color:var(--k-acc);margin-bottom:.7rem;
}
.bubble .b-title{
  font-weight:800;color:var(--k-text);font-size:1rem;line-height:1.4;
  padding-block-end:.7rem;margin-block-end:.7rem;border-block-end:1px solid var(--k-line);
}
.bubble ul{list-style:none;margin:0;padding:0;display:grid;gap:.75rem}
.bubble li{margin:0;font-size:.92rem;line-height:1.5}
.bubble li b{display:block;color:var(--k-text);font-weight:700}
.bubble .lnk{
  display:block;font-family:var(--k-font-en);font-size:.76rem;color:var(--k-muted);
  overflow-wrap:anywhere;
}
.bubble .meta{
  margin-block-start:.9rem;padding-block-start:.7rem;border-block-start:1px solid var(--k-line);
  font-size:.78rem;color:var(--k-muted);
}

/* הדמיה ב׳ — כרטיס השיתוף שנוצר לכל כתבה */
.ogcard{border:1px solid var(--k-line);border-radius:var(--k-r-md);overflow:hidden;background:var(--k-card)}
.ogcard .art{
  aspect-ratio:1200/630;background:var(--k-night);color:#fff;
  padding:clamp(1rem,2.6vw,1.5rem);display:flex;flex-direction:column;justify-content:flex-end;
  position:relative;isolation:isolate;
}
.ogcard .art::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(var(--k-line-dark) 1px,transparent 1px),
                   linear-gradient(90deg,var(--k-line-dark) 1px,transparent 1px);
  background-size:48px 48px;opacity:.5;
}
.ogcard .brand{
  position:absolute;inset-block-start:clamp(1rem,2.6vw,1.5rem);inset-inline-start:clamp(1rem,2.6vw,1.5rem);
  font-family:var(--k-font-en);font-size:.7rem;font-weight:700;
  letter-spacing:var(--k-micro-ls);color:var(--k-acc-bright);
}
.ogcard .kicker{
  display:inline-block;align-self:flex-start;font-size:.7rem;font-weight:700;
  letter-spacing:var(--k-micro-ls);color:var(--k-night);background:var(--k-acc-bright);
  padding:.24em .7em;border-radius:var(--k-r-sm);margin-bottom:.6rem;
}
.ogcard .art h3{color:#fff;font-size:clamp(1rem,.85rem + .7vw,1.3rem);margin:0;line-height:1.25}
.ogcard .foot{
  display:flex;flex-wrap:wrap;gap:.4rem 1rem;justify-content:space-between;
  padding:.7rem 1rem;font-family:var(--k-font-en);font-size:.72rem;color:var(--k-muted);
  border-block-start:1px solid var(--k-line);
}

/* רשימת האבטחה — מפתח קבוע משמאל, הסבר לצדו */
.speclist{list-style:none;margin:0;padding:0;display:grid;gap:0;
  border-block-start:1px solid var(--k-line-dark)}
.speclist li{
  margin:0;display:grid;gap:.2rem .9rem;grid-template-columns:1fr;
  padding-block:.85rem;border-block-end:1px solid var(--k-line-dark);
  font-size:.94rem;color:var(--k-on-dark);
}
@media (min-width:520px){.speclist li{grid-template-columns:96px 1fr;align-items:baseline}}
.speclist .k{
  font-family:var(--k-font-en);font-size:.7rem;font-weight:700;
  letter-spacing:var(--k-micro-ls);color:var(--k-acc-bright);
}
.speclist .v b{color:#fff}