/* Layout concept: a reading column beside a quiet table of contents; paper and ink, one teal accent used sparingly. */
:root {
  color-scheme: dark;
  --bg: #1b2536;
  --surface: #243349;
  --fg: #f4f5f7;
  --muted: #c9d1dd;
  --accent: #5fb8ff;
  --accent-soft: #2d4262;
  --line: #41556f;
  --gold: #5fb8ff;
  --gold-soft: #33486a;

  font-family: "Heebo", system-ui, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #1b2536;
    --surface: #243349;
    --fg: #f4f5f7;
    --muted: #c9d1dd;
    --accent: #5fb8ff;
    --accent-soft: #2d4262;
    --line: #41556f;
    --gold: #5fb8ff;
    --gold-soft: #33486a;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #1b2536;
  --surface: #243349;
  --fg: #f4f5f7;
  --muted: #c9d1dd;
  --accent: #5fb8ff;
  --accent-soft: #2d4262;
  --line: #41556f;
  --gold: #5fb8ff;
  --gold-soft: #33486a;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  line-height: 1.8;
  font-size: 17px;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
  padding-block: 0 48px;
  overflow-x: hidden;
}
h1, h2, h3, h4 { font-family: "Heebo", system-ui, sans-serif; line-height: 1.25; letter-spacing: -0.01em; text-wrap: balance; }
h2 { font-size: 2rem; font-weight: 800; margin: 0.2em 0 0.6em; }
h3 { font-size: 1.4rem; font-weight: 800; margin: 1.8em 0 0.5em; color: var(--accent); }
h4 { font-size: 1.12rem; font-weight: 700; margin: 1.4em 0 0.3em; }
p { margin: 0 0 1em; max-width: 68ch; }
a { color: var(--accent); }
a:focus-visible, summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }
strong { font-weight: 700; }
ul, ol { padding-inline-start: 1.3em; margin: 0 0 1em; }
li { margin-bottom: 0.4em; }

/* header */
.wrap-top { max-width: 1120px; margin: 0 auto; }
.masthead { padding: 56px 0 40px; border-bottom: 1px solid var(--line); }
.masthead .kicker { font-size: 0.85rem; letter-spacing: 0.04em; color: var(--muted); margin: 0 0 12px; }
.masthead h1 { font-size: clamp(2.2rem, 6vw, 3.6rem); font-weight: 900; letter-spacing: -0.02em; margin: 0 0 16px; }
.masthead .sub { font-size: 1.12rem; color: var(--muted); max-width: 46ch; margin: 0 0 24px; }
.author { display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: center; margin-top: 8px; }
.author .name { font-weight: 700; }
.author .meta { color: var(--muted); font-size: 0.95rem; }
.btn-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.btn { display: inline-block; padding: 10px 18px; border-radius: 999px; text-decoration: none; font-weight: 500; border: 1px solid var(--accent); color: var(--accent); }
.btn.solid { background: var(--accent); color: var(--bg); }

/* layout */
.layout { max-width: 1120px; margin: 0 auto; display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 48px; align-items: start; }
.side { position: sticky; top: env(safe-area-inset-top, 0px); padding-top: 32px; max-height: 100vh; overflow-y: auto; }
.toc-desk { display: block; }
.toc-mobile { display: none; }
.toc-title { font-weight: 700; margin: 0 0 10px; color: var(--muted); font-size: 0.9rem; letter-spacing: 0.04em; }
.toc { list-style: none; padding: 0; margin: 0; }
.toc li { margin: 0; }
.toc a { display: block; padding: 5px 10px; text-decoration: none; color: var(--fg); border-radius: 6px; font-size: 0.93rem; line-height: 1.4; }
.toc a:hover { background: var(--surface); }
.toc a.active { background: var(--accent-soft); color: var(--accent); font-weight: 700; }
.nav-no { display: block; font-size: 0.72rem; color: var(--muted); font-weight: 500; }
.main { min-width: 0; padding-top: 48px; }

/* hero intro */
.intro { padding: 0 0 40px; border-bottom: 1px solid var(--line); margin-bottom: 40px; }
.intro .lead { font-size: 1.2rem; }
.principles { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-top: 24px; }
.principles > div { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 18px 20px; }
.principles h3 { margin: 0 0 6px; font-size: 1.1rem; }
.principles p { margin: 0; font-size: 0.97rem; }

/* chapters */
.chapter { padding-bottom: 56px; margin-bottom: 56px; border-bottom: 1px solid var(--line); scroll-margin-top: 24px; }
.chapter:last-of-type { border-bottom: 0; }
.chapno { font-size: 0.85rem; letter-spacing: 0.04em; color: var(--muted); margin: 0 0 6px; font-weight: 500; }
.lead { font-size: 1.22rem; line-height: 1.7; color: var(--fg); font-weight: 300; margin-bottom: 1.4em; }

/* callout boxes */
.box { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 20px 22px; margin: 1.6em 0; }
.box > p:last-child, .box > ul:last-child, .box > ol:last-child { margin-bottom: 0; }
.box-title { font-family: "Heebo", system-ui, sans-serif; font-weight: 700; font-size: 1.1rem; color: var(--accent); margin: 0 0 8px; }
.box.def { background: var(--accent-soft); border-color: transparent; }
.box.note { background: var(--surface); border-style: dashed; }
/* one background per category: רוצה לומר / חשוב לדעת / המלצה */
.box.cat-say  { background: #ffc78a; border-color: #f0a24f; color: #1f2430; }
.box.cat-know { background: #fff6c7; border-color: #e0c75a; color: #1f2430; }
.box.cat-rec  { background: #c9ab8c; border-color: #a88a68; color: #1f2430; }
.box.cat-say .box-title { color: #6b2e05; }
.box.cat-know .box-title { color: #6b5200; }
.box.cat-rec .box-title { color: #4a2f17; }
.box.cat-rec a { color: #1f4f8a; }
.box.cat-rec a, .box.cat-know a { color: #1f4f8a; }
/* statistics corner: cream */
.box.cat-stat { background: #f5ecd7; border-color: #d9c79a; color: #1f2430; }
.box.cat-stat .box-title { color: #5a4a2a; }
.box.cat-stat a { color: #1f4f8a; }
/* commentator corner: light grey */
.box.cat-comm { background: #e4e7eb; border-color: #c3c9d1; color: #1f2430; }
.box.cat-comm .box-title { color: #3a4350; }
.box.cat-comm a { color: #1f4f8a; }
.box.stat { background: var(--gold-soft); border-color: transparent; }
.box.stat .box-title { color: var(--gold); }
.box.rec { border-color: var(--accent); color: inherit; }
.box.rec .box-title { color: var(--accent); }
.box.rec a { color: var(--accent); }
.box.tip { border-inline-start: 0; background: transparent; }
.box.example { background: transparent; }
.box.story { background: #f1ebdf; color: #1f2430; border-color: #cbb995; font-style: normal; }
.box.story .box-title { color: #4a3510; }
.box.story a { color: #4a3510; }
.box.story .verse .vcap { color: #4a3510; }
.box.story .box-title::before { content: "סיפור קצר: "; font-weight: 500; color: var(--muted); }
.box.pros { background: var(--accent-soft); border-color: transparent; }
.box.cons { background: var(--gold-soft); border-color: transparent; }
.box.cons .box-title { color: var(--gold); }
.box-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; margin: 1.6em 0; }
.box-grid .box { margin: 0; }

/* lists */
.checklist, .steps, .causes, .recs, .bio { list-style: none; padding: 0; }
.checklist li, .steps li, .causes li, .bio li { position: relative; padding-inline-start: 1.8em; }
.checklist li::before { content: ""; position: absolute; inset-inline-start: 0.35em; top: 0.62em; width: 0.5em; height: 0.5em; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ffffff 0%, #cfd5de 35%, #9aa3b0 70%, #6d7682 100%); box-shadow: 0 0 0 1px rgba(184,146,58,.55), 0 1px 2px rgba(0,0,0,.35); }
.bio li::before { content: "•"; position: absolute; inset-inline-start: 0.2em; color: var(--accent); }
.causes li::before { content: "◦"; position: absolute; inset-inline-start: 0.2em; color: var(--accent); }
.steps { counter-reset: st; }
.steps li { counter-increment: st; padding-inline-start: 2.4em; }
.steps li::before { content: counter(st); position: absolute; inset-inline-start: 0; top: 0.1em; width: 1.7em; height: 1.7em; border-radius: 50%; background: var(--accent-soft); color: var(--accent); font-weight: 700; display: grid; place-items: center; font-size: 0.9rem; }
.recs { counter-reset: rc; }
.recs li { counter-increment: rc; padding-inline-start: 2.4em; }
.recs li::before { content: counter(rc); position: absolute; inset-inline-start: 0; top: 0.15em; font-family: "Heebo", system-ui, sans-serif; font-weight: 900; color: var(--accent); font-size: 1.2rem; }
.bio { margin: 0 0 1em; }

/* legal text (appendix) */
.box.note p, .box.rec p { max-width: none; }
.chapter p strong:first-child { }

/* tables and wide content */
table { width: 100%; border-collapse: collapse; margin: 1.2em 0; display: block; overflow-x: auto; }
th, td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: start; vertical-align: top; }
th { color: var(--accent); }

/* footer */
.foot { margin-top: 24px; padding-top: 28px; border-top: 1px solid var(--line); color: var(--muted); font-size: 0.95rem; }
.foot p { max-width: none; }
.foot-small { font-size: 0.85rem; }

/* responsive */
@media (max-width: 900px) {
  .layout { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .side { position: static; max-height: none; padding-top: 16px; }
  .toc-desk { display: none; }
  .toc-mobile { display: block; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; }
  .toc-mobile summary { cursor: pointer; font-weight: 700; color: var(--accent); }
  .toc-mobile .toc { margin-top: 10px; max-height: 60vh; overflow-y: auto; }
  .toc-mobile .toc a { display: flex; gap: 10px; align-items: baseline; }
  .nav-no { display: inline; margin-inline-end: 6px; }
  .main { padding-top: 24px; }
  .masthead { padding-top: 32px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* paper doves */
:root {
  --dove-1: #ffffff;
  --dove-2: #cfe2de;
  --dove-3: #8db9b1;
  --dove-line: #1f5c58;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --dove-1: #e9eef1;
    --dove-2: #7fa8a1;
    --dove-3: #4b7670;
    --dove-line: #86c7bd;
  }
}
:root[data-theme="dark"] {
  --dove-1: #e9eef1;
  --dove-2: #7fa8a1;
  --dove-3: #4b7670;
  --dove-line: #86c7bd;
}
.dove { width: 56px; height: auto; display: inline-block; filter: drop-shadow(0 2px 2px rgb(0 0 0 / 0.12)); }
.dove.sm { width: 26px; vertical-align: middle; margin-inline-end: 10px; transform: rotate(-8deg); }
.chapno { display: flex; align-items: center; }
.chapter:nth-of-type(even) .chapno .dove.sm { transform: rotate(7deg) scaleX(-1); }
.flock { position: relative; height: 150px; margin: 28px 0 8px; max-width: 560px; }
.flock .dove { position: absolute; }
.flock .d1 { width: 92px; top: 10px; inset-inline-start: 4%; transform: rotate(-10deg); }
.flock .d2 { width: 64px; top: 52px; inset-inline-start: 30%; transform: rotate(6deg) scaleX(-1); }
.flock .d3 { width: 48px; top: 6px; inset-inline-start: 52%; transform: rotate(-4deg); }
.flock .d4 { width: 40px; top: 74px; inset-inline-start: 70%; transform: rotate(12deg); }
.flock .d5 { width: 34px; top: 28px; inset-inline-start: 84%; transform: rotate(-16deg) scaleX(-1); }
.flock .trail { position: absolute; inset: 0; width: 100%; height: 100%; }
.flock .trail path { fill: none; stroke: var(--dove-line); stroke-width: 1.4; stroke-dasharray: 2 7; stroke-linecap: round; opacity: 0.55; }
.foot-flock { display: flex; gap: 14px; align-items: flex-end; margin-bottom: 18px; }
.foot-flock .dove { width: 38px; }
.foot-flock .dove:nth-child(2) { width: 26px; transform: scaleX(-1); }
.foot-flock .dove:nth-child(3) { width: 30px; }
@media (prefers-reduced-motion: no-preference) {
  .flock .dove { animation: bob 6s ease-in-out infinite; }
  .flock .d2 { animation-delay: -1.5s; }
  .flock .d3 { animation-delay: -3s; }
  .flock .d4 { animation-delay: -4.5s; }
  .flock .d5 { animation-delay: -2.2s; }
}
@keyframes bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
@media (max-width: 600px) {
  .flock { height: 120px; }
  .flock .d1 { width: 70px; }
  .flock .d5 { display: none; }
}

/* verse stories, as printed in the book */
.box.story.verse-box .box-title::before { content: none; }
.verse { font-size: 1.02rem; }
.verse .vl { display: block; line-height: 1.95; }
.verse .vcap { font-family: "Heebo", system-ui, sans-serif; font-size: 1rem; color: var(--accent); margin: 1.1em 0 0.15em; font-weight: 700; }
.verse .vcap:first-child { margin-top: 0; }

/* full right-to-left layout */
:root { direction: rtl; }
body { direction: rtl; text-align: start; }
.masthead, .intro, .chapter, .main, .foot, .side, .toc, .btn-row, .author, .principles, .box, .box-grid, .verse, .steps, .checklist, .recs, .causes, .bio { direction: rtl; text-align: start; }

/* site name */
.site-name { font-family: "Heebo", system-ui, sans-serif; font-weight: 900; font-size: clamp(2.6rem, 8vw, 4.4rem); line-height: 1.1; margin: 0 0 0.15em; color: var(--accent); }

/* short looping motion graphic */
.motion { margin: 28px 0 8px; max-width: 640px; }
.motion svg { width: 100%; height: auto; display: block; }
.motion figcaption { font-size: 0.95rem; color: var(--muted); margin-top: 8px; max-width: 60ch; }
.motion .m-bg { fill: var(--surface); stroke: var(--line); }
.motion .m-roof-a { fill: var(--accent); }
.motion .m-roof-b { fill: var(--accent-soft); }
.motion .m-door { fill: var(--gold); }
.motion .m-win-a, .motion .m-win-b { fill: var(--gold-soft); stroke: var(--gold); }
.motion .m-label { font-family: "Heebo", sans-serif; font-size: 15px; fill: var(--fg); font-weight: 500; }
.motion .m-split { stroke: var(--fg); stroke-width: 2; stroke-dasharray: 6 6; }
@media (prefers-reduced-motion: no-preference) {
  .motion .m-house { transform-origin: 320px 170px; animation: house-breathe 5s ease-in-out infinite; }
  .motion .m-split { animation: split-slide 5s ease-in-out infinite; }
  .motion .f1 { animation: fly-a 6s ease-in-out infinite; }
  .motion .f2 { animation: fly-b 7s ease-in-out infinite; }
  .motion .f3 { animation: fly-c 5.5s ease-in-out infinite; }
}
@keyframes house-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.03); } }
@keyframes split-slide { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(-14px); } }
@keyframes fly-a { 0%, 100% { translate: 0 0; } 50% { translate: 24px -10px; } }
@keyframes fly-b { 0%, 100% { translate: 0 0; } 50% { translate: -20px 12px; } }
@keyframes fly-c { 0%, 100% { translate: 0 0; } 50% { translate: 16px 10px; } }

/* flock between chapters */
.flight { display: flex; justify-content: center; align-items: flex-end; gap: 18px; margin: 40px 0 0; opacity: 0.9; }
.flight .dove { width: 34px; }
.flight .dove:nth-child(2) { width: 24px; transform: scaleX(-1) translateY(-10px); }
.flight .dove:nth-child(3) { width: 28px; transform: translateY(-18px); }
@media (prefers-reduced-motion: no-preference) {
  .flight .dove { animation: bob 5s ease-in-out infinite; }
  .flight .dove:nth-child(2) { animation-delay: -1.7s; }
  .flight .dove:nth-child(3) { animation-delay: -3.1s; }
}

/* paper creases on origami doves */
.crease { stroke: rgb(0 0 0 / 0.22); stroke-width: 1.2; stroke-linecap: round; fill: none; }

.motion .flyer { fill: none; }

/* prominent chapter summary box */
.chapter-points { border-inline-start: 0; }
.chapter-points .box-title { font-size: 1.2rem; }
.chapter-points ul { columns: 2; column-gap: 28px; }
@media (max-width: 600px) { .chapter-points ul { columns: 1; } }

/* quick links to chapters under the author name */
.quick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.quick a { font-size: 0.85rem; text-decoration: none; color: var(--accent); border: 1px solid var(--line); border-radius: 999px; padding: 4px 12px; background: var(--surface); }
.quick a:hover { border-color: var(--accent); }

/* black band with gold rule, taken from the existing site design */
.band { position: relative; background: #000; color: #fff; border-bottom: 3px solid #5fb8ff; margin: 0 calc(-1 * max(16px, env(safe-area-inset-left, 0px))) 0; padding: 22px max(16px, env(safe-area-inset-left, 0px)) 36px; overflow: hidden; text-align: center; }
.band-logo { display: block; margin: 0 auto 10px; width: clamp(160px, 22vw, 220px); height: auto; filter: drop-shadow(0 6px 14px rgb(0 0 0 / .35)); }
.band-hero { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.band-book { width: min(230px, 56vw); height: auto; filter: drop-shadow(0 18px 30px rgb(255 255 255 / 0.08)); }
.band-title { width: min(600px, 92%); height: auto; margin-top: 4px; }
.band .bird { position: absolute; width: clamp(60px, 11vw, 120px); height: auto; opacity: 0.95; z-index: 0; }
.band .b-pink { top: 120px; inset-inline-start: 4%; transform: rotate(-8deg); }
.band .b-gold { top: 26px; inset-inline-end: 8%; transform: rotate(10deg); }
.band .b-blue { top: 210px; inset-inline-end: -2%; width: clamp(80px, 13vw, 150px); }
.band .b-tan { top: 300px; inset-inline-start: -1%; width: clamp(70px, 11vw, 120px); }
.band .site-name { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
@media (prefers-reduced-motion: no-preference) {
  .band .bird { animation: bob 6s ease-in-out infinite; }
  .band .b-gold { animation-delay: -2s; }
  .band .b-blue { animation-delay: -4s; }
}
.author-card { max-width: 1120px; margin: 40px auto 0; display: flex; gap: 28px; align-items: flex-start; flex-wrap: wrap; padding-bottom: 32px; border-bottom: 1px solid var(--line); }
.author-photo { width: min(220px, 60vw); height: auto; border-radius: 12px; border: 1px solid var(--line); }
.author-text { flex: 1 1 260px; min-width: 0; }
.author-text .kicker { margin-top: 0; }
.top-btns { flex: 0 0 100%; display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; align-items: center; margin-top: 4px; }
.top-btns .btn { flex: 1 1 200px; text-align: center; margin-top: 0; }
.cta-panel { flex: 0 0 100%; margin-top: 6px; }
.cta-cap { margin: 0 0 8px; font-size: .8rem; font-weight: 500; color: rgb(255 255 255 / .55); }
.cta-grid { display: grid; grid-template-columns: 1fr; gap: 8px; }
.cta-btn { display: flex; align-items: center; justify-content: center; min-height: 42px; padding: 8px 12px; border-radius: 10px; text-decoration: none; font-weight: 600; font-size: .92rem; text-align: center; border: 1px solid rgb(240 180 60 / .6); background: transparent; color: #5fb8ff; transition: background .2s, border-color .2s; }
.cta-primary { color: #5fb8ff; border-color: rgb(240 180 60 / .55); }
.cta-primary:hover { background: rgb(95 184 255 / .10); }
.cta-secondary:hover { background: rgb(255 255 255 / .06); border-color: rgb(255 255 255 / .28); }
@media (max-width: 640px) { .cta-grid { grid-template-columns: 1fr; } }

/* compact images */
.band-logo { width: 150px; margin-bottom: 4px; }
.band-book { width: min(150px, 40vw); }
.band-title { width: min(460px, 88%); }
.band .bird { width: clamp(36px, 6vw, 64px); opacity: 0.85; }
.band .b-pink { top: 96px; inset-inline-start: 6%; }
.band .b-gold { top: 18px; inset-inline-end: 6%; }
.band .b-blue { top: 150px; inset-inline-end: 3%; width: clamp(44px, 7vw, 74px); }
.band .b-tan { top: 220px; inset-inline-start: 3%; width: clamp(40px, 6vw, 66px); }
.author-photo { width: 112px; height: 112px; object-fit: cover; border-radius: 50%; border: 3px solid #b9c2cc; padding: 3px; background: linear-gradient(145deg, #ffffff 0%, #d6dce4 30%, #9fd8f7 58%, #e9f7ff 80%, #c3ccd6 100%); box-shadow: 0 6px 14px -6px rgba(0,0,0,.45); }
.buy-cta { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; margin: 36px 0 8px; padding: 18px; border: 1px dashed var(--accent); border-radius: 14px; }
.buy-book { width: 84px; height: auto; border-radius: 4px; box-shadow: 0 8px 18px rgb(0 0 0 / 0.15); flex: 0 0 auto; }
.buy-cta > div { flex: 1 1 220px; min-width: 0; }
.buy-title { margin: 0 0 4px; font-family: "Heebo", system-ui, sans-serif; font-size: 1.25rem; font-weight: 700; }
.buy-text { margin: 0 0 10px; color: var(--muted); font-size: 0.95rem; }

/* paper birds from the reference image, used throughout the site */
.pbird { height: auto; width: 46px; display: inline-block; filter: drop-shadow(0 3px 4px rgb(0 0 0 / 0.15)); }
.pbird.sm { width: 26px; vertical-align: middle; margin-inline-end: 10px; }
.flight .pbird { width: 46px; }
.flight .pbird:nth-child(2) { width: 34px; transform: scaleX(-1) translateY(-10px); }
.flight .pbird:nth-child(3) { width: 40px; transform: translateY(-18px); }
.foot-flock .pbird { width: 46px; }
.foot-flock .pbird:nth-child(2) { width: 34px; transform: scaleX(-1); }
.foot-flock .pbird:nth-child(3) { width: 40px; }

/* birds flying across the chapter end, following a dotted trail */
.flock-row { position: relative; height: 140px; max-width: 560px; margin: 36px auto 8px; }
.flock-row .trail { position: absolute; inset: 0; width: 100%; height: 100%; }
.flock-row .trail path { fill: none; stroke: var(--dove-line); stroke-width: 1.4; stroke-dasharray: 2 7; stroke-linecap: round; opacity: 0.6; }
.flock-row .fb { position: absolute; height: auto; filter: drop-shadow(0 4px 5px rgb(0 0 0 / 0.14)); }
.flock-row .fb1 { width: 100px; top: 22px; inset-inline-start: 3%; transform: rotate(-8deg); }
.flock-row .fb2 { width: 74px; top: 14px; inset-inline-start: 33%; transform: rotate(3deg) scaleX(-1); }
.flock-row .fb3 { width: 92px; top: 6px; inset-inline-start: 56%; transform: rotate(-4deg); }
.flock-row .fb4 { width: 70px; top: 52px; inset-inline-start: 80%; transform: rotate(6deg) scaleX(-1); }
.flock-row .fb { animation: bob 6s ease-in-out infinite; }
.flock-row .fb2 { animation-delay: -1.5s; }
.flock-row .fb3 { animation-delay: -3s; }
.flock-row .fb4 { animation-delay: -4.5s; }
@media (max-width: 560px) {
  .flock-row { height: 120px; }
  .flock-row .fb1 { width: 70px; }
  .flock-row .fb2 { width: 50px; }
  .flock-row .fb3 { width: 60px; }
  .flock-row .fb4 { display: none; }
}
@media (prefers-reduced-motion: reduce) { .flock-row .fb { animation: none; } }

.foot-flock { gap: 10px; }
.foot-flock .pbird { width: 58px; }
.foot-flock .pbird:nth-child(2) { width: 48px; transform: scaleX(-1); }

/* only a pair of birds per group */
.flock-row .fb2 { width: 84px; top: 26px; inset-inline-start: 42%; }
.flock-row .fb1 { width: 100px; top: 30px; inset-inline-start: 26%; }

/* a pair of birds facing each other, small gap between them */
.flock-row .fb1 { width: 100px; top: 34px; inset-inline-start: 20%; transform: rotate(-4deg); }
.flock-row .fb2 { width: 92px; top: 36px; inset-inline-start: 60%; transform: rotate(3deg); }
.foot-flock .pbird:nth-child(2) { transform: none; width: 52px; }
.foot-flock .pbird { width: 58px; }

.foot-flock { gap: 28px; }

/* bird pair pose depends on the chapter's content */
.flock-row.v-together .fb1 { inset-inline-start: 28%; top: 34px; }
.flock-row.v-together .fb2 { inset-inline-start: 53%; top: 36px; }
.flock-row.v-apart .fb1 { inset-inline-start: 20%; top: 34px; }
.flock-row.v-apart .fb2 { inset-inline-start: 60%; top: 36px; }
.flock-row.v-high .fb1 { inset-inline-start: 24%; top: 0; transform: rotate(-12deg); }
.flock-row.v-high .fb2 { inset-inline-start: 52%; top: 4px; transform: rotate(10deg); }
.flock-row.v-low .fb1 { inset-inline-start: 24%; top: 78px; transform: rotate(6deg); }
.flock-row.v-low .fb2 { inset-inline-start: 54%; top: 84px; transform: rotate(-4deg); }

.band .bird { filter: drop-shadow(0 4px 6px rgb(0 0 0 / 0.5)); }
.pbird { filter: drop-shadow(0 5px 6px rgb(60 40 20 / 0.22)); }

/* prominent chapter index at the top of the site */
.index { max-width: 1120px; margin: 36px auto 8px; }
.index-title { margin: 0 0 4px; font-size: 1.7rem; color: var(--accent); }
.index-sub { margin: 0 0 16px; color: var(--muted); font-size: 0.98rem; }
.index-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
.idx-card { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: var(--fg); background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; min-height: 96px; transition: transform .15s ease, border-color .15s ease; }
.idx-card:hover { transform: translateY(-2px); border-color: var(--accent); }
.idx-card:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.idx-no { font-size: 0.8rem; font-weight: 700; color: var(--accent); letter-spacing: 0.03em; }
.idx-title { font-family: "Heebo", system-ui, sans-serif; font-size: 1.08rem; font-weight: 700; line-height: 1.35; }
@media (prefers-reduced-motion: reduce) { .idx-card { transition: none; } }

/* story prose: every paragraph on its own line with clear spacing */
.box.story p { display: block; max-width: none; margin: 0 0 0.9em; line-height: 1.85; }
.box.story p:last-child { margin-bottom: 0; }

/* contact copy buttons */
.copy-btn{font:inherit;font-size:.85em;margin-inline-start:.5em;padding:.15em .7em;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--fg);cursor:pointer}
.copy-btn:hover{border-color:var(--accent);color:var(--accent)}

/* trust strip + sticky contact bar (design pass) */
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:980px;margin:18px auto 8px;padding:0 4px}
.trust-item{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:.95rem;line-height:1.5}
.trust-no{font-family:"Heebo", system-ui, sans-serif;font-weight:900;color:var(--accent);font-size:1.3rem;flex:0 0 auto}
@media (max-width:720px){.trust{grid-template-columns:1fr}}
.contact-bar{position:fixed;inset-inline:0;bottom:0;z-index:50;display:flex;gap:8px;justify-content:center;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));background:var(--surface);border-top:2px solid var(--accent);box-shadow:0 -6px 18px rgb(0 0 0 / .2)}
.contact-bar a{flex:1 1 0;max-width:200px;text-align:center;text-decoration:none;font-weight:700;padding:9px 10px;border-radius:999px;background:var(--accent);color:#1b2536}
.contact-bar a:hover{filter:brightness(1.08)}
body{padding-bottom:84px}

/* chapter names colour */
.idx-title, .chapter h2 { color: #a9d4f5; }

/* modern hero band (design refresh) */
.band { background: radial-gradient(120% 90% at 50% 0%, #2a3a55 0%, #1b2536 52%, #141d2c 100%); border-bottom: 0; border-radius: 0 0 28px 28px; padding-bottom: 44px; box-shadow: 0 18px 40px rgb(0 0 0 / .25); }
.band::after { content: ""; position: absolute; inset-inline: 12%; bottom: 0; height: 3px; background: linear-gradient(90deg, transparent, #5fb8ff, transparent); }
.band-logo { opacity: .95; }
.band-book { filter: drop-shadow(0 22px 28px rgb(0 0 0 / .45)) drop-shadow(0 0 46px rgb(95 184 255 / .25)); transform: rotate(-3deg); }
.band-title { filter: drop-shadow(0 6px 14px rgb(0 0 0 / .35)); }
.band .site-name { position: absolute; }
.band .band-sub { position: static; width: auto; height: auto; overflow: visible; clip: auto; margin: 6px 0 0; color: #5fb8ff; font-size: clamp(1.1rem, 3.5vw, 1.4rem); font-weight: 700; }
.band .band-heading {position: static; width: auto; height: auto; overflow: visible; clip: auto; margin: 10px 0 0; color: #fff; font-size: clamp(2.2rem, 7vw, 3.6rem); font-weight: 900; line-height: 1.1; font-family: "Heebo", system-ui, sans-serif; text-shadow: 0 4px 14px rgb(0 0 0 / .35); }

/* compact header for chapter pages */
.mini-head{display:flex;align-items:center;gap:12px;padding:12px 4px;border-bottom:2px solid var(--accent);margin-bottom:8px}
.mini-logo img{display:block;height:auto}
.mini-title{flex:1;font-family:"Heebo", system-ui, sans-serif;font-weight:900;font-size:1.15rem;color:var(--accent);text-decoration:none}
.mini-home{font-size:.9rem;color:var(--fg);text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:4px 12px}

.top-cta{display:inline-block;margin-top:14px;padding:10px 26px;border-radius:999px;font-weight:700;text-decoration:none}

/* back to top */
.to-top { position: fixed; top: 12px; inset-inline-start: 16px; z-index: 60; background: #5fb8ff; color: #1a1a1a; text-decoration: none; font-weight: 700; font-size: 12px; line-height: 1.2; padding: 6px 12px; border-radius: 999px; border: 2px solid #d4ecff; box-shadow: 0 4px 12px rgba(0,0,0,.35), 0 0 0 2px rgba(95,184,255,.35); }
.to-top:hover, .to-top:focus-visible { filter: brightness(1.08); transform: translateY(-2px); }
@media (max-width: 640px) { .to-top { font-size: 11px; padding: 5px 10px; inset-inline-start: 10px; top: 8px; } }

.to-back { position: fixed; top: 12px; inset-inline-end: 16px; z-index: 60; background: #5fb8ff; color: #1a1a1a; font: inherit; font-weight: 700; font-size: 12px; line-height: 1.2; padding: 6px 12px; border-radius: 999px; border: 2px solid #d4ecff; box-shadow: 0 4px 12px rgba(0,0,0,.35), 0 0 0 2px rgba(95,184,255,.35); cursor: pointer; }
.to-back:hover, .to-back:focus-visible { filter: brightness(1.08); transform: translateY(-2px); }
@media (max-width: 640px) { .to-back { font-size: 11px; padding: 5px 10px; inset-inline-end: 10px; top: 8px; } }

/* each chapter tile gets its own tint */
.idx-card.dove-white { background: #eaf4fd; color: #1f2430; border-color: #d9d4c7; }
.idx-card.dove-blue { background: #d4e9fb; color: #1f2430; border-color: #d9d4c7; }
.idx-card.dove-pink { background: #c2dff7; color: #1f2430; border-color: #d9d4c7; }
.idx-card.dove-gold { background: #fff6c7; color: #1f2430; border-color: #e0c75a; }
.idx-card.dove-green { background: #e3f0fa; color: #1f2430; border-color: #d9d4c7; }
.idx-card.dove-lilac { background: #cbe2f5; color: #1f2430; border-color: #d9d4c7; }
/* tile colours: dark orange and dark purple (light text) */
.idx-card.dove-white, .idx-card.dove-green, .idx-card.dove-teal { background: #ffc78a; color: #1f2430; border-color: #f0a24f; }
.idx-card.dove-pink, .idx-card.dove-lilac, .idx-card.dove-coral { background: #d9c4f5; color: #1f2430; border-color: #a983d9; }
.idx-card.dove-white .idx-title, .idx-card.dove-green .idx-title, .idx-card.dove-teal .idx-title,
.idx-card.dove-pink .idx-title, .idx-card.dove-lilac .idx-title, .idx-card.dove-coral .idx-title { color: inherit; }
.idx-card.dove-teal { background: #a6cdef; color: #1f2430; border-color: #d9d4c7; }
.idx-card.dove-coral { background: #d9ebfa; color: #1f2430; border-color: #d9d4c7; }
/* chapter names on tiles: bold and dark */
.idx-card .idx-title { color: #1f2430; font-weight: 900; font-size: 1.2rem; }
/* chapter tiles: flat colour with a thin gold hairline */
.idx-card { position: relative; box-shadow: inset 0 0 0 1px rgba(184,146,58,.5); }

/* birds in flight: drift along a loop and flap */
@keyframes soar { 0%, 100% { translate: 0 0; rotate: 0deg; } 25% { translate: 18px -12px; rotate: -4deg; } 50% { translate: 6px -22px; rotate: 2deg; } 75% { translate: -14px -8px; rotate: -2deg; } }
@keyframes flap { 0%, 100% { scale: 1 1; } 50% { scale: 1 0.84; } }
@media (prefers-reduced-motion: no-preference) {
  .flock-row .fb { animation: soar 9s ease-in-out infinite; }
  .flock-row .fb2 { animation-delay: -2.5s; }
  .flock-row .fb3 { animation-delay: -5s, -0.6s; }
  .flock-row .fb4 { animation-delay: -7s; }
  .flight .pbird, .flight .dove { animation: soar 6s ease-in-out infinite; }
  .flight .pbird:nth-child(2), .flight .dove:nth-child(2) { animation-delay: -2s; }
  .flight .pbird:nth-child(3), .flight .dove:nth-child(3) { animation-delay: -4s; }
}
/* two birds fly toward each other, meet in the middle and return */
@keyframes approach-r { 0%, 100% { inset-inline-start: 3%; } 50% { inset-inline-start: 21%; } }
@keyframes approach-l { 0%, 100% { inset-inline-start: 33%; } 50% { inset-inline-start: 23%; } }
@media (prefers-reduced-motion: no-preference) {
  .flock-row .fb1 { animation: soar 9s ease-in-out infinite, approach-r 7s ease-in-out infinite; }
  .flock-row .fb2 { animation: soar 9s ease-in-out infinite -2.5s, approach-l 7s ease-in-out infinite; }
}

/* book-style quotation */
.quote { border-inline-start: 4px solid var(--accent); padding: 8px 16px; margin: 1em 0; color: var(--muted); font-style: italic; }


/* silver finish for the contact bar and the purchase buttons */
.contact-bar a, .cta-btn.cta-secondary, .btn.solid { background: linear-gradient(160deg, #ffffff 0%, #cdeeff 30%, #9fd8f7 60%, #d9efff 100%); color: #1b2536; border: 1px solid #6fb6e6; box-shadow: inset 0 1px 0 rgba(190,234,255,.95), inset 0 -1px 0 rgba(20,80,130,.22), 0 6px 14px -8px rgba(0,40,80,.55); }
.contact-bar a:hover, .cta-btn.cta-secondary:hover, .btn.solid:hover { filter: brightness(1.04); }

/* top contact and purchase buttons take the box category colours: WhatsApp = say (orange), e-vrit = know (yellow), Steimatzky = recommend (dark pink) */
.cta-btn.cta-secondary[href*="wa.me"] { background: linear-gradient(160deg, #fff3e2 0%, #ffc78a 48%, #f3a663 100%); color: #1b2536; border: 1px solid #e0954a; }
.cta-btn.cta-secondary[href*="e-vrit"] { background: linear-gradient(160deg, #fffdf0 0%, #fff6c7 48%, #efdc85 100%); color: #1b2536; border: 1px solid #d9bd55; }
.cta-btn.cta-secondary[href*="steimatzky"] { background: #d9c4f5; color: #1b2536; border: 1px solid #a983d9; }
/* author name beside the photo: larger */
.author-card .author .name { font-size: 1.6rem; font-weight: 800; line-height: 1.3; }

/* classic law-firm finish: flat category colours, gold hairline frame, gold accent bar on the start edge */
.box.cat-say, .box.cat-know, .box.cat-rec, .box.cat-comm, .box.cat-stat { position: relative; background-image: none; box-shadow: inset 0 0 0 1px rgba(184,146,58,.55); }
.box.cat-say::before, .box.cat-know::before, .box.cat-rec::before, .box.cat-comm::before, .box.cat-stat::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: 0; width: 4px; background: #b8923a; border-radius: 0; pointer-events: none; }
/* a soft glint across every chapter tile; colours unchanged */
.idx-card[class*="dove-"] { background-image: linear-gradient(115deg, rgba(255,255,255,0) 18%, rgba(255,255,255,.5) 40%, rgba(255,255,255,.18) 56%, rgba(255,255,255,0) 72%); }
/* chapter opening paragraph: same size as the rest of the text */
.chapter .lead { font-size: inherit; font-weight: inherit; line-height: inherit; }
/* numbered lists: same silver-and-gold round marker as the dots, dark numerals */
.steps li::before, .recs li::before { content: counter(st); }
.recs li::before { content: counter(rc); }
.steps li::before, .recs li::before { width: 1.7em; height: 1.7em; top: 0.1em; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 35% 30%, #ffffff 0%, #cfd5de 35%, #9aa3b0 70%, #6d7682 100%); color: #1b2536; font-family: "Heebo", system-ui, sans-serif; font-weight: 800; font-size: 0.9rem; box-shadow: 0 0 0 1px rgba(184,146,58,.55), 0 1px 2px rgba(0,0,0,.35); }
/* bottom contact bar: logo + label in each button */
.contact-bar a { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
/* each bottom button is now its brand logo: a round button in the logo colour, filling the whole button */
.contact-bar a { flex: 0 0 auto; max-width: none; width: 64px; height: 64px; padding: 0; border-radius: 50%; border: 0; box-shadow: 0 6px 14px -6px rgba(0,0,0,.6); overflow: hidden; }
.contact-bar a svg { width: 100%; height: 100%; display: block; }
.contact-bar a svg circle { fill: transparent; }
.contact-bar a[href^="https://wa.me"] { background: #25D366; }
.contact-bar a[href^="tel:"] { background: #1a73e8; }
.contact-bar a[href^="mailto:"] { background: #ea4335; }
.contact-bar a:hover { filter: brightness(1.06); transform: translateY(-2px); }
/* logo buttons: silver frame and a glint over the brand colour */
.contact-bar a { box-shadow: inset 0 0 0 2px rgba(226,231,238,.9), inset 0 -10px 16px -10px rgba(0,0,0,.25), 0 6px 14px -6px rgba(0,0,0,.6); }
.contact-bar a[href^="https://wa.me"], .contact-bar a[href^="tel:"], .contact-bar a[href^="mailto:"] {
  background-image: linear-gradient(115deg, rgba(255,255,255,0) 20%, rgba(255,255,255,.55) 42%, rgba(255,255,255,0) 60%), linear-gradient(180deg, rgba(255,255,255,.28) 0%, rgba(255,255,255,0) 50%, rgba(0,0,0,.12) 100%); }
/* bottom contact bar: the three logo images themselves, no button background */
.contact-bar a, .contact-bar a[href^="https://wa.me"], .contact-bar a[href^="tel:"], .contact-bar a[href^="mailto:"] { background: none; background-image: none; box-shadow: none; border: 0; border-radius: 0; width: 64px; height: 64px; padding: 0; overflow: visible; }
.contact-bar a img { width: 64px; height: 64px; object-fit: contain; display: block; }
.contact-bar a:hover { filter: brightness(1.06); transform: translateY(-2px); }
/* bottom contact bar: even spacing between the three logos */
.contact-bar { justify-content: space-evenly; gap: 0; }
/* recommendation boxes: bolder, higher-contrast text */
.box.cat-rec, .box.cat-rec p { color: #000000; font-weight: 600; }
.box.cat-rec .box-title { color: #2a1600; font-weight: 800; }
/* say boxes: bolder, higher-contrast text */
.box.cat-say, .box.cat-say p { color: #000000; font-weight: 600; }
.box.cat-say .box-title { color: #2a1600; font-weight: 800; }
/* know boxes: bolder, higher-contrast text */
.box.cat-know, .box.cat-know p { color: #000000; font-weight: 600; }
.box.cat-know .box-title { color: #3d2e00; font-weight: 800; }

/* ---- SEO / navigation additions (split site) ---- */
.chapter-title { font-family: "Heebo", system-ui, sans-serif; font-size: 2rem; font-weight: 800; line-height: 1.25; letter-spacing: -0.01em; text-wrap: balance; margin: 0.2em 0 0.6em; color: #a9d4f5; }
.crumbs { font-size: 0.95rem; margin: 0 0 12px; color: #c9d6e6; }
.crumbs a { color: #a9d4f5; }
.pn { display: flex; gap: 12px; justify-content: space-between; flex-wrap: wrap; margin: 28px 0 8px; }
.pn a { flex: 1 1 220px; padding: 12px 14px; border-radius: 12px; background: rgba(255,255,255,0.06); color: #a9d4f5; text-decoration: none; font-weight: 700; }
.pn a small { display: block; font-weight: 400; opacity: 0.8; }
.pn .pn-next { text-align: start; }
.pn .pn-prev { text-align: end; }

/* קישורים פנימיים בסוף הפרקים */
.related{margin-top:22px;padding:14px 18px;border-right:4px solid #5fb8ff;border-radius:10px;background:rgba(95,184,255,.08);line-height:1.9}
.related a{font-weight:700;text-decoration:underline;text-underline-offset:3px}