/* ============================================================
   שפת אור · site.css — שכבת פריסה משותפת (layout only)
   כל הצבע/הטיפוגרפיה מגיע מ-tokens.css. כאן רק מבנה.
   ============================================================ */

.wrap{max-width:760px;margin:0 auto;padding:0 var(--sp-4)}
.wrap--wide{max-width:960px}

/* --- סרגל עליון --- */
header.bar{display:flex;align-items:center;justify-content:space-between;
  padding:var(--sp-3) var(--sp-4);max-width:960px;margin:0 auto}
.brandline{display:flex;align-items:center;gap:var(--sp-2);
  font-family:var(--font-display);font-weight:700;font-size:19px;color:var(--fg);text-decoration:none}
.crumb{font-family:var(--font-body);font-size:13px;color:var(--fg-muted)}
.crumb a{color:var(--fg-muted);text-decoration:none}
.lang{font-family:var(--font-body);font-size:13px;color:var(--fg-muted);display:flex;gap:var(--sp-2)}
.lang b{color:var(--fg)}

/* --- hero (דף בית) --- */
.hero{text-align:center;padding:var(--sp-6) var(--sp-4) calc(var(--sp-6) + 8px);border-radius:0 0 24px 24px}
.hero h1{font-size:52px;margin:var(--sp-4) 0 var(--sp-2);letter-spacing:1px}
.hero .tagline{font-family:var(--font-body);font-weight:300;font-size:20px;color:#C8CEDC;max-width:560px;margin:0 auto;line-height:1.6}
.hero .kicker{font-family:var(--font-body);font-size:14px;letter-spacing:3px;color:var(--c-speculation-d)}

/* --- מקרא קטגוריות --- */
.legend{display:flex;flex-wrap:wrap;gap:var(--sp-4);justify-content:center;padding:var(--sp-4);
  margin-top:calc(-1 * var(--sp-5));position:relative}
.legend .chip{background:var(--bg-raised);border:1px solid var(--border);border-radius:999px;
  padding:var(--sp-2) var(--sp-3);box-shadow:0 1px 2px rgba(0,0,0,.04)}

/* --- בלוקים וכותרות --- */
section.block{padding:var(--sp-6) 0 0}
h2.sec{font-size:30px;margin:0 0 var(--sp-2)}
.lead{color:var(--fg-muted);max-width:640px;margin:0 0 var(--sp-4)}

/* --- גריד ערכים + כרטיס ערך --- */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3)}
.entry-card{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius-md);
  padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-2);text-decoration:none;color:var(--fg)}
.entry-card .top{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--sp-2)}
.entry-card h3{font-family:var(--font-display);font-weight:700;font-size:22px;margin:0}
.entry-card .def{font-size:15px;color:var(--fg)}
.entry-card .tags{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-1)}
.entry-card .more{margin-top:auto;font-family:var(--font-body);font-size:14px;color:var(--cat-science)}
.entry-card.is-hidden{display:none}

/* --- פילטר קטגוריות --- */
.filter{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin:0 0 var(--sp-4)}
.filter button{font-family:var(--font-body);font-size:14px;cursor:pointer;
  background:transparent;border:1px solid var(--border);border-radius:999px;padding:var(--sp-1) var(--sp-3);color:var(--fg)}
.filter button[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}

/* --- דף ערך --- */
.entry-head{padding:var(--sp-5) 0 var(--sp-3)}
.entry-head .tags{display:flex;gap:var(--sp-3);margin-bottom:var(--sp-3)}
.entry-head h1{font-size:48px;margin:0 0 var(--sp-2);line-height:1.1}
.entry-head .def{font-family:var(--font-display);font-weight:500;font-size:24px;color:var(--fg);line-height:1.5;margin:0}
.body p{font-size:17px;line-height:1.85}
.l1{font-size:19px;line-height:1.85;margin:var(--sp-4) 0}

/* --- רמות (details) --- */
details{border:1px solid var(--border);border-radius:var(--radius-md);margin:var(--sp-3) 0;overflow:hidden;background:var(--bg-raised)}
summary{cursor:pointer;list-style:none;padding:var(--sp-3) var(--sp-4);display:flex;align-items:center;justify-content:space-between;
  font-family:var(--font-body);font-weight:500;font-size:15px;color:var(--fg)}
summary::-webkit-details-marker{display:none}
summary .lvl{display:flex;align-items:center;gap:var(--sp-2)}
summary .chev{color:var(--fg-muted);transition:transform .2s}
details[open] summary .chev{transform:rotate(180deg)}
details[open] summary{border-bottom:1px solid var(--border)}
.details-body{padding:var(--sp-3) var(--sp-4) var(--sp-4)}

/* --- מה ידוע / פתוח / אסור --- */
.status{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--sp-3);margin:var(--sp-4) 0}
.status .cell{border-top:3px solid var(--border);padding-top:var(--sp-2)}
.status .cell.know{border-color:var(--cat-science)}
.status .cell.open{border-color:var(--cat-philosophy)}
.status .cell.never{border-color:var(--cat-speculation)}
.status h4{font-family:var(--font-body);font-size:13px;margin:0 0 var(--sp-1);color:var(--fg-muted);font-weight:500}
.status p{font-size:14px;margin:0;line-height:1.6}

/* --- מקורות --- */
.sources{list-style:none;padding:0;margin:0}
.sources li{display:flex;gap:var(--sp-2);align-items:baseline;padding:var(--sp-2) 0;border-bottom:1px solid var(--border);font-size:15px}
.sources li:last-child{border-bottom:0}
.sources .src-cat{flex:none}

/* --- מושגים קשורים + מסע --- */
.related{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-3)}
.related a{font-family:var(--font-body);font-size:14px;text-decoration:none;color:var(--fg);
  border:1px solid var(--border);border-radius:999px;padding:var(--sp-1) var(--sp-3)}
.journey{display:flex;align-items:center;gap:var(--sp-2);font-size:14px;color:var(--fg-muted);
  background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius-md);
  padding:var(--sp-3) var(--sp-4);margin-top:var(--sp-4)}
.journey b{color:var(--fg);font-weight:500}

/* --- open question + footer --- */
.openq{background:var(--c-night);color:var(--c-light);border-radius:var(--radius-md);padding:var(--sp-5);margin-top:var(--sp-5);text-align:center}
.openq h3{font-family:var(--font-display);font-size:26px;margin:0 0 var(--sp-2)}
.openq p{color:#C8CEDC;max-width:560px;margin:0 auto}
footer{margin-top:var(--sp-6);border-top:1px solid var(--border);padding:var(--sp-5) 0;text-align:center;color:var(--fg-muted);font-size:13px}
footer .fmark{display:flex;align-items:center;justify-content:center;gap:var(--sp-2);
  font-family:var(--font-display);font-weight:700;font-size:18px;color:var(--fg);margin-bottom:var(--sp-2)}
footer .free{max-width:520px;margin:var(--sp-2) auto 0;line-height:1.6}

@media(max-width:760px){.grid{grid-template-columns:1fr}.hero h1{font-size:40px}.entry-head h1{font-size:36px}.status{grid-template-columns:1fr}}
