@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Hebrew:wght@300;400;600;700;900&display=swap');
/* Styles of the ביו page blocks (src/puck/bio-config.tsx; /bio renders them).
   Linked from inside each block so the editor canvas iframe gets it too. No next/font var
   (undefined in the canvas would invalidate the whole font stack). */
/* עמוד הביו (התוכן של "אודות") — scoped under .bio, same language as home.css / podcast.css:
   navy #15303e, cream #f7f2ee, terracotta #b76a50, Noto Sans Hebrew, px/clamp (immune to
   marketing.css viewport-rem). Navy blocks full-bleed, square corners. */
.bio {
  --navy: #15303e;
  --glow: #25495c;
  --teal: #0f5568;
  --cream: #f7f2ee;
  --terra: #b76a50;
  --gold: #c9954f;
  --gutter: clamp(20px, 5vw, 72px);
  --pad-y: clamp(72px, 7vw, 120px);
  --fs-h2: clamp(28px, 3vw, 52px);
  --fs-body: clamp(17px, 1.16vw, 20px);

  background: var(--cream);
  color: var(--navy);
  font-family: 'Noto Sans Hebrew', sans-serif;
  font-size: var(--fs-body);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}
.bio *, .bio *::before, .bio *::after { box-sizing: border-box; }
.bio h1, .bio h2, .bio p, .bio figure, .bio blockquote { margin: 0; }
.bio a { color: inherit; text-decoration: none; }
.bio :focus-visible { outline: 2px solid var(--terra); outline-offset: 2px; }
html:has(.bio) { scroll-behavior: smooth; }

.bio-line {
  display: inline-block; align-self: flex-start; padding-bottom: 18px;
  background: linear-gradient(var(--terra), var(--terra)) 100% 100% / 34% 3px no-repeat;
}
.bio-h1 { font-size: var(--fs-h2); font-weight: 700; line-height: 1.15; }
.bio-h2 { font-size: var(--fs-h2); font-weight: 700; line-height: 1.15; }
.bio-body { font-size: var(--fs-body); line-height: 1.65; white-space: pre-wrap; }

/* ── פתיח: אודות + ציטוט + קישורי הפרקים ── */
.bio-hero {
  display: flex; flex-direction: column; align-items: flex-start; gap: 60px;
  padding: var(--pad-y) var(--gutter) clamp(48px, 5vw, 72px);
  background: radial-gradient(ellipse 60% 90% at 20% 30%, var(--glow) 0%, rgba(37, 73, 92, 0.5) 40%, rgba(21, 48, 62, 0) 75%), var(--navy);
  color: var(--cream);
}
.bio-quote { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.bio-quote-text { font-size: clamp(36px, 4.6vw, 84px); font-weight: 300; line-height: 1.1; }
.bio-quote-by { font-size: var(--fs-body); font-weight: 600; color: var(--gold); }
.bio-tabs {
  display: flex; flex-wrap: wrap; gap: 12px 30px; width: 100%;
  padding-top: 30px; border-top: 1px solid rgba(247, 242, 238, 0.3);
}
.bio-tabs a {
  font-size: var(--fs-body); font-weight: 700; padding-bottom: 6px; border-bottom: 3px solid var(--terra);
  transition: color 0.2s;
}
.bio-tabs a:hover { color: var(--gold); }

/* ── פרקים: טקסט מול תמונה ── */
.bio-section { padding: var(--pad-y) var(--gutter); }
.bio-panel {
  padding: var(--pad-y) var(--gutter);
  background: radial-gradient(ellipse 70% 90% at 25% 40%, var(--glow) 0%, rgba(37, 73, 92, 0.5) 40%, rgba(21, 48, 62, 0) 75%), var(--navy);
  color: var(--cream);
}
.bio-split {
  scroll-margin-top: 90px;
  display: flex; flex-wrap: wrap; align-items: flex-start; gap: 60px clamp(40px, 6vw, 120px);
}
.bio-split-text { flex: 1.4 1 440px; display: flex; flex-direction: column; gap: 24px; max-width: 44em; }
.bio-split-text .bio-h2 { margin-bottom: 12px; }
.bio-split-art { order: 2; flex: 1 1 300px; display: flex; justify-content: center; position: sticky; top: 120px; }
.bio-split-art img { display: block; width: 100%; max-width: 520px; height: auto; }
.bio-split-art--small img { max-width: 300px; }

@media (max-width: 760px) {
  .bio-split-art { position: static; order: 0; }
  .bio-split-art img { max-width: 360px; }
  .bio-split-art--small img { max-width: 220px; }
}
@media (prefers-reduced-motion: reduce) { html:has(.bio) { scroll-behavior: auto; } }

/* rich-text bodies (editor output = <p> per paragraph) */
.bio-rich p { margin: 0; }
.bio-rich p + p { margin-top: 24px; } /* margin, not flex gap: the editor wraps the <p>s in its own element */
.bio-rich a { text-decoration: underline; }
.bio-tabs:empty { display: none; }