/* Heebo, self-hosted (variable weight, @fontsource-variable/heebo 5.3.0) */
@font-face {
  font-family: "Heebo"; font-style: normal; font-display: swap; font-weight: 100 900;
  src: url("assets/fonts/heebo-hebrew.woff2") format("woff2-variations");
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
@font-face {
  font-family: "Heebo"; font-style: normal; font-display: swap; font-weight: 100 900;
  src: url("assets/fonts/heebo-latin.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --paper: #FAF7F2;
  --sand: #F1EDE4;
  --line: #E4DDD0;
  --ink: #1F2421;
  --ink-soft: #4A524C;
  --green: #5DA16B;
  --green-line: #528F5E;
  --green-deep: #2F6B3E;
  --green-darker: #24532F;
  --green-wash: #E5F0E6;
  --white: #FFFFFF;
  --radius: 14px;
  --gutter: clamp(16px, 4vw, 40px);
  --max: 1160px;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --font: "Heebo", system-ui, "Segoe UI", Arial, sans-serif;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font);
  font-size: 1.125rem;
  line-height: 1.7;
  text-rendering: optimizeLegibility;
}
img, svg { display: block; max-width: 100%; }
h1, h2, h3 { margin: 0; line-height: 1.15; font-weight: 700; text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
ul, ol, dl, dd { margin: 0; padding: 0; }
ul, ol { list-style: none; }
a { color: var(--green-deep); text-underline-offset: 0.22em; text-decoration-thickness: 1px; }
a:hover { color: var(--green-darker); }
::selection { background: var(--green); color: var(--white); }
:focus-visible { outline: 3px solid var(--green-deep); outline-offset: 3px; border-radius: 6px; }

.wrap { width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: var(--gutter); }
/* Keeps a hyphenated title word ("Co-Founder") on one line. */
.nw { white-space: nowrap; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip {
  position: absolute; inset-inline-start: 16px; top: -60px; z-index: 50;
  background: var(--ink); color: var(--white); padding: 10px 16px; border-radius: 8px;
}
.skip:focus, .skip:hover { top: 12px; color: var(--white); }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  min-height: 52px; padding: 12px 26px;
  background: var(--green-deep); color: var(--white);
  border-radius: 999px; font-weight: 500; font-size: 1.0625rem; text-decoration: none;
  transition: background-color 0.25s var(--ease), transform 0.25s var(--ease);
}
.btn:hover { background: var(--green-darker); color: var(--white); }
.btn:active { transform: scale(0.98); }
.btn-arrow { width: 22px; height: 22px; transition: transform 0.3s var(--ease); }
.btn-arrow .stem { fill: none; stroke: currentColor; stroke-width: 4.5; stroke-linecap: round; }
.btn-arrow .head { fill: currentColor; }
.btn:hover .btn-arrow { transform: translateX(-4px); }
.btn-small { min-height: 44px; padding: 8px 20px; font-size: 1rem; }
.btn-light { background: var(--white); color: var(--green-darker); }
.btn-light:hover { background: var(--green-wash); color: var(--green-darker); }
/* Buttons keep their pill shape when focused (the global focus ring would otherwise square their corners). */
.btn:focus-visible { border-radius: 999px; }
.btn[aria-disabled="true"] { background: var(--line); color: var(--ink-soft); pointer-events: none; }

.link-quiet { color: var(--ink); font-weight: 500; text-decoration: underline; text-decoration-color: var(--green); text-decoration-thickness: 2px; }

/* Header */
.site-header {
  position: sticky; top: 0; z-index: 20;
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  backdrop-filter: saturate(1.4) blur(10px);
  -webkit-backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s, box-shadow 0.3s;
}
.site-header.is-scrolled { border-bottom-color: var(--line); box-shadow: 0 6px 20px -12px rgba(31, 36, 33, 0.25); }
.header-inner { display: flex; align-items: center; gap: 24px; min-height: 72px; }
.brand img { height: 52px; width: auto; }
.site-header nav { margin-inline-start: auto; }
.nav-links { display: flex; gap: 28px; font-size: 1rem; }
.nav-links a { color: var(--ink-soft); text-decoration: none; padding-block: 6px; white-space: nowrap; }
.nav-links a:hover { color: var(--ink); box-shadow: inset 0 -2px 0 var(--green); }

/* Hero */
.hero { padding-block: clamp(40px, 7vw, 88px) clamp(56px, 8vw, 104px); overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 72px); align-items: center; }
.hero h1 { font-size: clamp(2.5rem, 5.4vw, 4.5rem); letter-spacing: -0.025em; line-height: 1.05; }
.hero h1 .accent { color: var(--green-deep); }
.tagline { margin-top: 18px; font-size: clamp(1.4rem, 2.4vw, 1.9rem); font-weight: 700; letter-spacing: -0.015em; line-height: 1.25; }
.lede { margin-top: 18px; max-width: 46ch; font-size: clamp(1.125rem, 1.6vw, 1.3rem); color: var(--ink-soft); }
/* Hero facts: two columns of two, each a dot beside the number with its label underneath. */
.facts { display: grid; grid-template-columns: repeat(2, max-content); gap: 18px clamp(32px, 5vw, 64px); margin-top: 28px; font-size: 1rem; color: var(--ink-soft); }
.facts li { display: grid; grid-template-columns: auto auto; justify-content: start; align-items: center; column-gap: 10px; }
.facts li::before { content: ""; grid-column: 1; grid-row: 1; width: 6px; height: 6px; border-radius: 50%; background: var(--green-line); }
.facts strong { grid-column: 2; grid-row: 1; color: var(--ink); font-weight: 700; font-size: 1.15rem; line-height: 1.3; font-variant-numeric: tabular-nums; }
.facts span { grid-column: 2; grid-row: 2; line-height: 1.4; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 36px; }
/* The three terms under the button: checkmarked tags, so "no tuition" reads at a glance. */
.hero-note { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 8px 10px; font-size: 0.98rem; font-weight: 500; color: var(--ink); }
.hero-note li { display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px 5px 14px; background: var(--green-wash); border-radius: 999px; }
.hero-note li::before { content: ""; width: 14px; height: 14px; flex: none; background: var(--green-deep); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; }
/* The fee footnote sits at the very bottom of the hero, just above the next section. */
.hero:has(.hero-footnote) { padding-bottom: 22px; }
.hero-footnote { margin-top: clamp(40px, 6vw, 80px); font-size: 0.85rem; color: var(--ink-soft); }
.closed-note { margin-top: 16px; font-size: 1rem; color: var(--ink-soft); max-width: 40ch; }
.note-mark { font-size: 0.75em; line-height: 0; vertical-align: 0.45em; margin-inline-start: 1px; }
.lede-end { display: none; }
.footer-logo { display: none; }
/* The tag is a flex row with a gap; pull the footnote mark back against its word. */
.hero-note .note-mark { margin-inline-start: -6px; }

.hero-loop { margin: 0; position: relative; container-type: inline-size; }
.loop { width: 100%; height: auto; overflow: visible; }
.hook-green { fill: var(--green); }
.hook-ink { fill: var(--ink); }
.loop-words {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  font-weight: 700; font-size: 7.4cqw; line-height: 1.12; letter-spacing: -0.01em; pointer-events: none;
}
.w-from { color: var(--green-deep); }
.w-to { color: var(--ink); }

@media (prefers-reduced-motion: no-preference) {
  .hook { transform-box: fill-box; animation: hook-in 1.1s var(--ease) both; }
  .hook-green { --from: -14%; }
  .hook-ink { --from: 14%; animation-delay: 0.25s; }
  .loop-words span { animation: appear 0.7s var(--ease) both; }
  .w-from { animation-delay: 0.5s; }
  .w-to { animation-delay: 0.75s; }
}
@keyframes hook-in { from { opacity: 0; transform: translateX(var(--from)); } }
@keyframes appear { from { opacity: 0; } }

/* Section rhythm */
.section-title { font-size: clamp(1.9rem, 3.6vw, 2.75rem); letter-spacing: -0.02em; }
.section-sub { margin-top: 14px; max-width: 58ch; color: var(--ink-soft); }
.who, .track, .people, .faq { padding-block: clamp(64px, 9vw, 120px); }
.who, .track, .faq { background: var(--sand); }

/* Who */
.who-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 40px; }
.who-list::before, .faq-list::before { content: ""; display: block; height: 6px; border-radius: 6px; background: var(--green-line); grid-column: 1 / -1; }
.who-list li { padding: 22px 0 8px; padding-inline-end: 28px; }
/* Three short names only, so a lighter rule than the FAQ's. */
.who-list::before { height: 4px; }
.who-list li + li { border-inline-start: 1px solid var(--line); padding-inline-start: 28px; }
.who-list h3 { font-size: clamp(1.35rem, 2.2vw, 1.7rem); letter-spacing: -0.015em; }
.who-list p { margin-top: 10px; color: var(--ink-soft); }
.who-spouses { margin-top: 28px; font-size: 1.15rem; font-weight: 500; }
.who-needs { margin-top: 28px; display: grid; gap: 10px; max-width: 70ch; }
.who-needs li { padding-inline-start: 18px; position: relative; color: var(--ink-soft); }
.who-needs li::before { content: ""; position: absolute; inset-inline-start: 0; top: 0.72em; width: 7px; height: 7px; border-radius: 50%; background: var(--green-line); }
.who-needs strong { color: var(--ink); }

/* Outcomes */
.outcomes { padding-block: clamp(64px, 9vw, 120px); }
.outcomes-cta { margin-top: 40px; }
.milestones { margin-top: 40px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(24px, 4vw, 56px); counter-reset: ms; }
.milestones li { padding-block: 24px 28px; border-top: 1px solid var(--line); counter-increment: ms; }
.milestones li:last-child h3 { color: var(--green-deep); }
.milestones h3 { font-size: 1.25rem; letter-spacing: -0.01em; display: flex; gap: 12px; align-items: baseline; }
/* Numbered rings that echo the stops on the program track. */
.milestones h3 { align-items: center; }
.milestones h3::before { content: counter(ms); flex: none; width: 34px; height: 34px; border-radius: 50%; border: 3px solid var(--green-line); display: grid; place-items: center; font-size: 0.95rem; font-weight: 700; color: var(--green-deep); background: var(--paper); font-variant-numeric: tabular-nums; }
.milestones li:last-child h3::before { background: var(--green-deep); border-color: var(--green-deep); color: var(--white); }
.milestones p { margin-top: 8px; color: var(--ink-soft); padding-inline-start: calc(34px + 12px); }

/* Success levels: a rising staircase, right to left (RTL), each step built on the one before. */
.levels { background: var(--green-wash); padding-block: clamp(64px, 9vw, 120px); }
.level-steps { --top: 216px; margin-top: 48px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 2vw, 24px); }
.level { display: flex; flex-direction: column; min-width: 0; }
/* --grow (0 to 1) scales each column's real height from the base, so the step grows rather than being uncovered. */
@property --grow { syntax: "<number>"; inherits: true; initial-value: 1; }
.level-bar {
  --grow: 1;
  position: relative; display: flex; align-items: flex-end; overflow: hidden;
  margin-top: calc(var(--top) - var(--h) * var(--grow)); height: calc(var(--h) * var(--grow)); padding: 18px 22px;
  border-radius: var(--radius) var(--radius) 4px 4px; background: var(--c); color: var(--fg);
}
/* Level icons: handshake (validation with real users), trophy (a paid pilot), money bag (paying customers).
   Drawn as masks so each takes its bar's text colour. Handshake and trophy paths after Lucide (ISC licence). */
.level-1 { --h: 96px; --c: #C9DFCC; --fg: var(--green-darker);
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m11 17 2 2a1 1 0 1 0 3-3'/%3E%3Cpath d='m14 14 2.5 2.5a1 1 0 1 0 3-3l-3.88-3.88a3 3 0 0 0-4.24 0l-.88.88a1 1 0 1 1-3-3l2.81-2.81a5.79 5.79 0 0 1 7.06-.87l.47.28a2 2 0 0 0 1.42.25L21 4'/%3E%3Cpath d='m21 3 1 11h-2'/%3E%3Cpath d='M3 3 2 14l6.5 6.5a1 1 0 1 0 3-3'/%3E%3Cpath d='M3 4h8'/%3E%3C/svg%3E"); }
.level-2 { --h: 156px; --c: #3E7A4C; --fg: var(--white);
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9H4.5a2.5 2.5 0 0 1 0-5H6'/%3E%3Cpath d='M18 9h1.5a2.5 2.5 0 0 0 0-5H18'/%3E%3Cpath d='M4 22h16'/%3E%3Cpath d='M10 14.66V17c0 .55-.47.98-.97 1.21C7.85 18.75 7 20.24 7 22'/%3E%3Cpath d='M14 14.66V17c0 .55.47.98.97 1.21C16.15 18.75 17 20.24 17 22'/%3E%3Cpath d='M18 2H6v7a6 6 0 0 0 12 0V2Z'/%3E%3C/svg%3E"); }
/* The top step is the goal, so it gets the one vivid green on the site, with dark text for contrast. */
.level-3 { --h: 216px; --c: #3EE07A; --fg: #10301B; --icon: var(--icon-money); }
.level-3 .level-bar { box-shadow: 0 14px 34px -14px rgba(62, 224, 122, 0.75); }
.level-bar::after {
  content: ""; position: absolute; top: 18px; inset-inline-start: 22px; width: 30px; height: 30px; background: currentColor;
  -webkit-mask: var(--icon) center / contain no-repeat; mask: var(--icon) center / contain no-repeat;
  /* The icon fades in over the last third of the growth, so it never sits on the label of a short column. */
  opacity: calc((var(--grow) - 0.65) * 3);
}
/* Motion: when the staircase scrolls into view, each column grows up from the base, one after another;
   its label fades in as the column finishes. The text inside never stretches, because the height grows, not a scale. */
@media (prefers-reduced-motion: no-preference) {
  /* Height and margin are animated directly (not through a custom property) so every browser, iPhone Safari included, runs it. */
  .js .level-bar { height: 0; margin-top: var(--top); transition: height 1.15s cubic-bezier(0.22, 1, 0.36, 1), margin-top 1.15s cubic-bezier(0.22, 1, 0.36, 1); transition-delay: calc(var(--i) * 380ms); }
  .js .level-steps.is-visible .level-bar { height: var(--h); margin-top: calc(var(--top) - var(--h)); }
  .js .level-bar::after { opacity: 0; transition: opacity 0.4s var(--ease); transition-delay: calc(var(--i) * 380ms + 800ms); }
  .js .level-steps.is-visible .level-bar::after { opacity: 1; }
  .js .level-t { opacity: 0; transform: translateY(10px); transition: opacity 0.6s var(--ease), transform 0.6s var(--ease); transition-delay: calc(var(--i) * 380ms + 700ms); }
  .js .level-steps.is-visible .level-bar { --grow: 1; }
  .js .level-steps.is-visible .level-t { opacity: 1; transform: none; }
}
.level-1 { --i: 0; }
.level-2 { --i: 1; }
.level-3 { --i: 2; }
.level-n { font-weight: 800; font-size: 1.25rem; letter-spacing: -0.01em; }
.level-t { margin-top: 16px; font-weight: 700; font-size: clamp(1.15rem, 1.7vw, 1.35rem); line-height: 1.35; text-wrap: balance; }

/* Network */
.network { padding-block: clamp(56px, 8vw, 104px); }
.network-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 32px clamp(32px, 6vw, 96px); align-items: start; }
.network-grid > div > p { margin-top: 16px; color: var(--ink-soft); max-width: 44ch; }
.network-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 32px; }
.network-list li { padding-top: 20px; border-top: 6px solid var(--green-line); border-radius: 0; }
.network-list h3 { font-size: 1.2rem; }
.network-list p { margin-top: 6px; color: var(--ink-soft); }
.perk-logo { display: block; margin-top: 12px; width: auto; height: 19px; }

.partners { margin-top: clamp(48px, 6vw, 72px); }
/* Partners as their own strip, right after the Bootstrap section. */
.partners-sec { padding-block: clamp(40px, 5vw, 64px); border-top: 1px solid var(--line); }
.partners-sec .partners { margin-top: 0; }
.partners-sec .partners-title { padding-top: 0; border-top: 0; }
.partners-title { font-size: 1.2rem; padding-top: 28px; border-top: 1px solid var(--line); }
.partner-logos { margin-top: 28px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 32px clamp(32px, 5vw, 72px); }
.partner-logos li { display: flex; align-items: center; justify-content: center; }
.partner-logos a { display: block; border-radius: 8px; padding: 6px; transition: opacity 0.25s var(--ease), transform 0.25s var(--ease); }
.partner-logos a:hover { opacity: 0.8; transform: translateY(-2px); }
.partner-logos img { display: block; width: auto; max-width: 100%; height: 82px; object-fit: contain; }
.partner-logos .p-wix { height: 46px; }
.partner-logos .p-guts { height: 46px; }
.partner-logos .p-nba { height: 64px; }
.partner-logos .p-matan { height: 86px; }
.partner-logos .p-base44 { height: 38px; }
/* Pop: when the strip scrolls into view, each logo springs in from small, one after another (slight overshoot). */
@media (prefers-reduced-motion: no-preference) {
  .js .partner-logos li { opacity: 0; transform: scale(0.55) translateY(14px); transition: opacity 0.45s ease-out, transform 0.7s cubic-bezier(0.34, 1.56, 0.64, 1); }
  .js .partner-logos.is-visible li { opacity: 1; transform: none; }
  .js .partner-logos li:nth-child(2) { transition-delay: 0.12s; }
  .js .partner-logos li:nth-child(3) { transition-delay: 0.24s; }
  .js .partner-logos li:nth-child(4) { transition-delay: 0.36s; }
  .js .partner-logos li:nth-child(5) { transition-delay: 0.48s; }
}

/* Apply */
.apply { background: var(--sand); padding-block: clamp(64px, 9vw, 120px); }
.steps { margin-top: 40px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.steps li { position: relative; padding-top: 8px; }
/* Each step fills another quarter of the ring, so the last step is a full circle. */
.step-n {
  --p: 0.25;
  display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
  border: 2.5px solid var(--green-deep); padding: 3px;
  background: conic-gradient(var(--green-deep) calc(var(--p) * 360deg), transparent 0) content-box;
  color: var(--green-darker); font-weight: 700; font-size: 1.2rem;
  text-shadow: 0 0 2px var(--sand), 0 0 3px var(--sand), 0 0 4px var(--sand);
}
.steps li:nth-child(2) .step-n { --p: 0.5; }
.steps li:nth-child(3) .step-n { --p: 0.75; }
.steps li:nth-child(4) .step-n { --p: 1; color: var(--white); text-shadow: none; }
.steps li:not(:last-child)::after { content: ""; position: absolute; top: 31px; inset-inline-start: 60px; inset-inline-end: -8px; height: 3px; border-radius: 3px; background: color-mix(in srgb, var(--green) 60%, var(--sand)); }
.steps h3 { margin-top: 16px; font-size: 1.2rem; }
.steps p { margin-top: 4px; color: var(--ink-soft); }
.apply-grid { margin-top: clamp(64px, 8vw, 96px); padding-top: clamp(40px, 5vw, 56px); border-top: 1px solid var(--line); display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 32px clamp(32px, 6vw, 80px); }
.apply-sub { font-size: 1.35rem; margin-bottom: 14px; }
.commit-list { display: grid; }
.commit-list li { padding: 14px 0; padding-inline-start: 20px; border-top: 1px solid var(--line); position: relative; }
.commit-list li::before { content: ""; position: absolute; inset-inline-start: 0; top: 1.45em; width: 8px; height: 8px; border-radius: 50%; border: 2.5px solid var(--green-deep); }

/* Approach */
.approach { padding-block: clamp(64px, 9vw, 120px); }
.approach-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.approach-grid > div > p { margin-top: 20px; max-width: 46ch; color: var(--ink-soft); }
.approach-grid > div > p.equity { width: fit-content; max-width: 100%; margin-top: 32px; padding: 18px 26px; background: var(--sand); border-radius: var(--radius); color: var(--ink); font-size: 1.15rem; }
.equity strong { color: var(--green-deep); }
/* When the box scrolls up past the lower third of the window it lights up in the level-3 green, with the same dark text and glow. */
.approach-grid > div > p.equity { transition: background-color 0.6s var(--ease), color 0.6s var(--ease), box-shadow 0.6s var(--ease); }
.equity strong { transition: color 0.6s var(--ease); }
.approach-grid > div > p.equity.is-lit { background: #3EE07A; color: #10301B; box-shadow: 0 14px 34px -14px rgba(62, 224, 122, 0.75); }
.equity.is-lit strong { color: #10301B; }
.gets { display: grid; gap: 0; }
.gets > div { padding-block: 20px; border-top: 1px solid var(--line); }
.gets > div:last-child { border-bottom: 1px solid var(--line); }
.gets dt { font-weight: 700; font-size: 1.2rem; }
.gets dt::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 50%; border: 3px solid var(--green-line); margin-inline-end: 12px; vertical-align: 1px; }
.gets dd { margin-top: 4px; color: var(--ink-soft); padding-inline-start: 26px; }

/* Track */
.track-board { position: relative; margin-top: 28px; }
/* Opening and closing events: icon badges at the two ends of the line (line ends sit 86px and 466px below the board top).
   Lightbulb = the idea you start with; money bag = the paying customers you end with. */
:root {
  --icon-idea: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 21h4M12 3a6 6 0 0 0-3.6 10.8c.7.5 1.1 1.3 1.1 2.1V16h5v-.1c0-.8.4-1.6 1.1-2.1A6 6 0 0 0 12 3z'/%3E%3C/svg%3E");
  --icon-money: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 3h5L13 6.5h-2z'/%3E%3Cpath d='M11 6.5C6.5 8.5 4.5 12.5 4.5 15.5a5.5 5.5 0 0 0 5.5 5.5h4a5.5 5.5 0 0 0 5.5-5.5c0-3-2-7-6.5-9'/%3E%3Cpath d='M14 12c-.4-.8-1.1-1.1-1.9-1.1-1 0-1.9.6-1.9 1.4s.8 1.2 1.9 1.5 1.9.7 1.9 1.5-.9 1.4-1.9 1.4c-.9 0-1.6-.4-2-1.1M12 9.6v1.3M12 16.7V18'/%3E%3C/svg%3E");
}
.track-board::before, .track-board::after, .track-start::before, .track-end::before {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--green-deep) var(--icon-idea) center / 22px no-repeat;
  box-shadow: 0 0 0 4px var(--sand);
}
.track-board::after, .track-end::before { background-image: var(--icon-money); }
.track-board::before, .track-board::after { content: ""; position: absolute; inset-inline-start: -6px; z-index: 1; }
.track-board::before { top: 66px; }
.track-board::after { top: 446px; }
.track-cap { font-size: 0.95rem; font-weight: 500; color: var(--green-deep); }
.track-start { height: 34px; line-height: 34px; margin-bottom: 12px; }
.track-end { margin-top: 12px; }
.track-line { position: absolute; inset-inline: 0; top: 46px; height: 460px; width: 100%; overflow: visible; pointer-events: none; }
.track-hook { display: none; }
.track-line path { fill: none; stroke: var(--green-line); stroke-width: 8; vector-effect: non-scaling-stroke; stroke-linecap: round; }
.stops {
  position: relative; height: 460px;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: 1fr 1fr;
  padding-inline-end: 12%;
}
.stop { grid-column: var(--c); grid-row: 1; display: flex; flex-direction: column; align-items: center; text-align: center; padding-inline: 10px; }
.stop.row2 { grid-row: 2; }
.stop .dot { width: 26px; height: 26px; border-radius: 50%; background: var(--paper); border: 5px solid var(--green-line); margin-top: 27px; flex: none; transition: background-color 0.4s var(--ease), transform 0.4s var(--ease); }
.stop .n { margin-top: 14px; font-size: 0.875rem; color: var(--green-deep); font-weight: 500; font-variant-numeric: tabular-nums; }
.stop .t { font-weight: 700; font-size: 1.1rem; line-height: 1.3; margin-top: 4px; }
.stop .d { margin-top: 4px; font-size: 0.92rem; line-height: 1.4; color: var(--ink-soft); max-width: 22ch; }
/* Session date: quiet, under the number, so it reads as a detail rather than a heading. */
.stop .when { margin-top: 2px; font-size: 0.8rem; line-height: 1.3; color: color-mix(in srgb, var(--ink-soft) 80%, var(--sand)); font-variant-numeric: tabular-nums; letter-spacing: 0.01em; }
/* Bottom row: the text reads in the same order as the top row (number, date, title, description),
   sitting just above the line, and the dot drops to the line under it. */
.stops .stop.row2 { flex-direction: column; justify-content: flex-end; align-self: end; }
.stop.row2 .n { margin-top: 0; }
.stop.row2 .dot { order: 1; margin-top: 14px; margin-bottom: 27px; }
.track-end { text-align: start; }

@media (prefers-reduced-motion: no-preference) {
  /* 1.1, not 1: with a non-scaling stroke Chromium falls a few pixels short of the path end at a dash of exactly 1. */
  .js .track-line path { stroke-dasharray: 1.1; stroke-dashoffset: 1.1; transition: stroke-dashoffset 2.2s var(--ease); }
  .js .track.is-visible .track-line path { stroke-dashoffset: 0; }
  .js .stop .dot { transform: scale(0.4); }
  .js .track.is-visible .stop .dot { transform: scale(1); transition-delay: calc(var(--i, 0) * 120ms + 300ms); }
  .js .stops::before { transform: scaleY(0); transition: transform 1.8s var(--ease); }
  .js .track.is-visible .stops::before { transform: scaleY(1); }
  .js .track-hook { opacity: 0; transition: opacity 0.5s var(--ease) 1.6s; }
  .js .track.is-visible .track-hook { opacity: 1; }
}

/* Lecturers */
.lecturers { padding-block: clamp(64px, 9vw, 120px); border-top: 1px solid var(--line); }
.lecturers-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.carousel-nav { display: flex; gap: 10px; flex: none; }
.carousel-nav[hidden] { display: none; }
.carousel-btn {
  width: 52px; height: 52px; border-radius: 50%; border: 2px solid var(--green-deep);
  background: transparent; color: var(--green-deep); display: grid; place-items: center; cursor: pointer;
  transition: background-color 0.25s var(--ease), color 0.25s var(--ease), opacity 0.25s;
}
.carousel-btn svg { width: 22px; height: 22px; }
.carousel-btn .stem { fill: none; stroke: currentColor; stroke-width: 4.5; stroke-linecap: round; }
.carousel-btn .head { fill: currentColor; }
.carousel-btn:hover { background: var(--green-deep); color: var(--white); }
.carousel-btn:disabled { opacity: 0.35; cursor: default; background: transparent; color: var(--green-deep); }
.lecturer-track {
  display: grid; grid-auto-flow: column; grid-auto-columns: clamp(240px, 24vw, 290px); gap: clamp(28px, 3.6vw, 52px);
  margin-top: 44px; padding-block: 8px 20px; overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--green) var(--line);
}
.lecturer-track:focus-visible { outline-offset: 6px; }
.lecturer { position: relative; scroll-snap-align: start; display: flex; flex-direction: column; align-items: center; text-align: center; }
.lecturer .face { max-width: 204px; font-size: 2rem; }
.lecturer .name { margin-top: 18px; font-weight: 700; font-size: 1.15rem; line-height: 1.3; }
.lecturer .role { margin-top: 2px; margin-bottom: 10px; font-size: 0.95rem; line-height: 1.45; color: var(--ink-soft); }
.in-link { margin-top: auto; translate: 0 10px; font-size: 0.95rem; font-weight: 500; padding: 6px 4px; }
/* Photo and name together are the person's LinkedIn link. */
.person-link { display: flex; flex-direction: column; align-items: center; width: 100%; color: inherit; text-decoration: none; border-radius: 16px; }
.person-link .face { transition: border-color 0.25s var(--ease), transform 0.35s var(--ease); }
.person-link .name { transition: color 0.2s var(--ease); text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 0.2em; text-decoration-thickness: 2px; }
.person-link:hover .face { border-color: var(--green-deep); transform: translateY(-3px); }
.person-link:hover .name { color: var(--green-deep); text-decoration-color: var(--green); }
.person-link:active .face { transform: scale(0.97); }
.person-link:focus-visible { outline-offset: 6px; }
.lecturer .face-more { background: transparent; border-style: dashed; border-color: color-mix(in srgb, var(--green) 70%, var(--paper)); }
.lecturer-more .name { color: var(--ink-soft); }

/* People */
.people { border-top: 1px solid var(--line); }
.team { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 32px 20px; margin-top: 44px; }
.team li { display: flex; flex-direction: column; align-items: center; text-align: center; }
.face {
  width: 100%; max-width: 140px; aspect-ratio: 1; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--green-wash); color: var(--green-deep);
  font-weight: 700; font-size: 1.6rem; letter-spacing: 0.04em;
  border: 3px solid var(--green-line); padding: 5px; background-clip: content-box;
}
img.face { display: block; width: 100%; height: auto; object-fit: cover; background-color: #FFFDF9; }
.team .name { margin-top: 14px; font-weight: 700; font-size: 1.02rem; line-height: 1.3; }
.team .role { margin-top: 2px; font-size: 0.9rem; color: var(--ink-soft); line-height: 1.4; }
.team .person-link + .board { margin-top: 3px; }
.team .board { margin-top: 6px; font-size: 0.8rem; font-weight: 600; color: var(--green-deep); line-height: 1.3; }
.mentors { margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--line); display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr); gap: 12px clamp(32px, 6vw, 96px); align-items: baseline; }
.mentors h3 { font-size: clamp(1.4rem, 2.4vw, 1.8rem); }
.mentors p { color: var(--ink-soft); max-width: 60ch; }

/* Details */
.detail-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
.detail-list > div { padding-block: 18px; border-top: 1px solid var(--line); }
.detail-list dt { font-size: 0.95rem; color: var(--ink-soft); }
.detail-list dd { margin-top: 2px; font-weight: 500; font-size: 1.15rem; }
.detail-list dd.tbd { color: var(--ink-soft); font-weight: 400; font-style: normal; }

/* FAQ */
.faq-wrap { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr); gap: 32px clamp(32px, 6vw, 96px); }
.faq-list { align-self: start; }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding-block: 22px; font-weight: 500; font-size: 1.2rem;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: ""; flex: none; width: 14px; height: 14px;
  border-right: 2.5px solid var(--green-deep); border-bottom: 2.5px solid var(--green-deep);
  transform: translateY(-3px) rotate(45deg); transition: transform 0.3s var(--ease);
}
.faq details[open] summary::after { transform: translateY(3px) rotate(-135deg); }
.faq summary:hover { color: var(--green-deep); }
.faq details p { padding-bottom: 24px; max-width: 62ch; color: var(--ink-soft); }

/* CTA */
.cta { background: var(--green-deep); color: var(--white); padding-block: clamp(64px, 9vw, 112px); position: relative; overflow: hidden; }
.cta-loop { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.cta-loop path { fill: none; stroke: #3A7A49; stroke-width: 30; stroke-linecap: round; }
.cta-inner { position: relative; z-index: 1; text-align: center; display: flex; flex-direction: column; align-items: center; }
.cta h2 { font-size: clamp(2rem, 4.4vw, 3.4rem); letter-spacing: -0.025em; color: var(--white); max-width: 18ch; }
.cta p { margin: 16px 0 32px; color: #DCEBDD; font-size: 1.2rem; }

/* Footer */
.site-footer { padding-block: 28px; font-size: 0.95rem; color: var(--ink-soft); }
.footer-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 32px; }
.footer-links { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.site-footer a { color: var(--ink-soft); }
.site-footer a:hover { color: var(--green-deep); }

/* Document pages */
.doc { max-width: 820px; padding-block: clamp(40px, 7vw, 88px); }
.doc h1 { font-size: clamp(2.2rem, 5vw, 3.2rem); letter-spacing: -0.025em; }
.doc h2 { font-size: 1.6rem; margin-top: 48px; margin-bottom: 12px; letter-spacing: -0.015em; }
.doc h3 { font-size: 1.2rem; margin-top: 32px; margin-bottom: 8px; }
.doc p + p { margin-top: 12px; }
.doc-meta { color: var(--ink-soft); font-size: 0.95rem; margin-top: 8px; margin-bottom: 28px; }
.doc-list { list-style: disc; padding-inline-start: 1.4em; margin-top: 12px; }
.doc-list li::marker { color: var(--green); }
.doc-olist { list-style: decimal; padding-inline-start: 1.6em; margin-block: 12px; }
.doc-list li + li, .doc-olist li + li { margin-top: 6px; }
.doc-contact { margin-top: 16px; border-top: 1px solid var(--line); }
.doc-contact > div { display: flex; gap: 16px; padding-block: 12px; border-bottom: 1px solid var(--line); }
.doc-contact dt { min-width: 110px; color: var(--ink-soft); }
.doc-contact dd { font-weight: 500; }
.doc-callout { background: var(--sand); border-radius: var(--radius); padding: 24px 28px; margin-top: 28px; }
.doc-callout h2 { margin-top: 0; font-size: 1.3rem; }
.notfound { min-height: 55vh; }
.notfound p { margin-top: 16px; color: var(--ink-soft); }
.notfound-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 32px !important; }

/* Menu button (mobile) */
.menu-btn { display: none; width: 44px; height: 44px; border: 0; background: transparent; border-radius: 50%; cursor: pointer; place-items: center; flex: none; color: var(--ink); }
.menu-btn:hover { background: var(--sand); }
.menu-icon, .menu-icon::before, .menu-icon::after { display: block; width: 22px; height: 2.5px; border-radius: 2px; background: currentColor; transition: transform 0.3s var(--ease), opacity 0.2s; }
.menu-icon { position: relative; }
.menu-icon::before, .menu-icon::after { content: ""; position: absolute; inset-inline-start: 0; }
.menu-icon::before { top: -7px; }
.menu-icon::after { top: 7px; }
.menu-open .menu-icon { background: transparent; }
.menu-open .menu-icon::before { transform: translateY(7px) rotate(45deg); }
.menu-open .menu-icon::after { transform: translateY(-7px) rotate(-45deg); }

/* Responsive */
@media (max-width: 1240px) {
  .nav-links { gap: 20px; font-size: 0.95rem; }
}

/* The seven menu items fit on one line above 1100px; below that, the menu button takes over. */
@media (max-width: 1100px) {
  .menu-btn { display: grid; }
  .site-header .btn-small { margin-inline-start: auto; }
  .site-header nav {
    position: absolute; inset-inline: 0; top: 100%;
    background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: 0 18px 30px -20px rgba(31, 36, 33, 0.35);
    display: none;
  }
  .site-header.menu-open nav { display: block; }
  .site-header.menu-open { background: var(--paper); border-bottom-color: var(--line); }
  .nav-links { flex-direction: column; gap: 0; padding: 8px var(--gutter) 16px; font-size: 1.15rem; }
  .nav-links a { display: block; padding: 14px 0; border-bottom: 1px solid var(--line); color: var(--ink); }
  .nav-links li:last-child a { border-bottom: 0; }
  .nav-links a:hover { box-shadow: none; color: var(--green-deep); }
}

@media (max-width: 960px) {
  .team { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mentors { grid-template-columns: 1fr; }
  .milestones { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .network-grid { grid-template-columns: 1fr; }
  .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 32px; }
  .steps li:nth-child(2)::after { display: none; }
}

@media (max-width: 820px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-loop { width: 220px; margin-inline: auto; margin-top: 8px; }
  .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
  .face { max-width: 112px; }
  .who-list { grid-template-columns: 1fr; }
  .who-list li, .who-list li + li { padding: 22px 0; border-inline-start: 0; }
  .who-list li + li { border-top: 1px solid var(--line); }
  .approach-grid, .faq-wrap, .apply-grid { grid-template-columns: 1fr; }
  .detail-list { grid-template-columns: 1fr; }
  .milestones, .network-list { grid-template-columns: 1fr; }
  .partner-logos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 24px; justify-items: center; }
  .partner-logos img { height: 68px; }
  .partner-logos .p-wix { height: 37px; }
  .partner-logos .p-guts { height: 35px; }
  .partner-logos .p-nba { height: 50px; }
  .partner-logos .p-matan { height: 72px; }
  .partner-logos .p-base44 { height: 30px; }
  .partner-logos li:last-child:nth-child(odd) { grid-column: 1 / -1; }
  /* Stacked perks: hairline separators, not the heavy bars that head the desktop columns. */
  .network-list li { padding-block: 18px; border-top: 1px solid var(--line); }
  .network-list li:last-child { border-bottom: 1px solid var(--line); }
  .perk-logo { height: 16px; margin-top: 10px; }
  .stop .d bdi, .track-cap bdi { white-space: nowrap; }

  .track-line { display: none; }
  .track-board { margin-top: 24px; }
  .track-board::before, .track-board::after { display: none; }
  /* On the vertical track the event dots sit in the captions, on the line's axis. */
  .track-start { display: flex; align-items: center; gap: 14px; height: auto; line-height: 1.4; margin-bottom: 4px; }
  .track-start::before, .track-end::before { content: ""; flex: none; width: 36px; height: 36px; background-size: 20px; margin-inline-start: -5px; }
  .hook-head { display: none; }
  .stops { height: auto; display: block; padding: 0; position: relative; }
  .stops::before { content: ""; position: absolute; inset-inline-start: 10px; top: 14px; bottom: 0; width: 6px; border-radius: 6px 6px 0 0; background: var(--green-line); transform-origin: top; }
  .track-end { display: flex; align-items: flex-end; gap: 0; margin-top: 0; padding-inline-start: 3px; }
  .track-end .track-hook { order: -1; }
  .track-end::before { margin-bottom: 1px; margin-inline-end: 12px; }
  .track-hook { display: block; width: 64px; height: 48px; flex: none; }
  .hook-line { fill: none; stroke: var(--green-line); stroke-width: 6; stroke-linecap: round; }
  .hook-head { fill: var(--green-deep); }
  .stop, .stops .stop.row2 { display: grid; grid-template-columns: 26px auto minmax(0, 1fr); column-gap: 14px; align-items: baseline; text-align: start; padding: 12px 0; position: relative; }
  .stop .dot, .stop.row2 .dot { grid-column: 1; grid-row: 1 / span 2; margin: 0; align-self: center; position: relative; }
  .stop .n, .stop.row2 .n { grid-column: 2; grid-row: 1; margin: 0; min-width: 1ch; }
  .stop .t, .stop.row2 .t { grid-column: 3; grid-row: 1; margin: 0; text-align: right; }
  .stop .d, .stop.row2 .d { grid-column: 3; grid-row: 3; margin: 2px 0 0; max-width: none; }
  .stop .when, .stop.row2 .when { grid-column: 3; grid-row: 2; margin: 0; }
  .stop .t[dir="ltr"] { unicode-bidi: plaintext; }
  .track-end { text-align: start; }
}

/* ------------------------------------------------------------------
   Phone (≤520px). A compact system of its own rather than the desktop squeezed:
   type 13 / 15 / 17 / 19 / 20 / 28 / 40, sections 48px (short ones 40px), 20px gutter,
   one numbered ring (32px, last one filled), one bullet (6px dot), checks only on the hero terms.
   ------------------------------------------------------------------ */
@media (max-width: 520px) {
  :root { --gutter: 20px; }
  html { scroll-padding-top: 72px; -webkit-tap-highlight-color: transparent; }
  body { font-size: 1.0625rem; line-height: 1.65; }

  /* Header: lighter; its apply button appears once the hero's own button has scrolled away. */
  .header-inner { min-height: 56px; gap: 12px; }
  .brand { display: flex; align-items: center; min-height: 44px; }
  .brand img { height: 36px; }
  .btn-small { min-height: 40px; padding: 6px 16px; font-size: 0.95rem; }

  /* Type scale */
  .section-title { font-size: 1.75rem; letter-spacing: -0.02em; }
  .section-sub, .approach-grid > div > p, .network-grid > div > p { margin-top: 12px; font-size: 1.0625rem; }
  h3, .network-list h3, .steps h3, .milestones h3, .apply-sub { font-size: 1.25rem; }
  .tagline { font-size: 1.1875rem; margin-top: 14px; }
  .lede { font-size: 1.0625rem; margin-top: 14px; }
  .lede-more { display: none; }
  .lede-end { display: inline; }

  /* Section rhythm */
  .who, .track, .people, .faq, .approach, .outcomes, .apply, .lecturers, .network { padding-block: 48px; }
  .partners-sec { padding-block: 36px; }
  .cta { padding-block: 48px; }
  .who-list, .milestones, .steps, .team, .lecturer-track { margin-top: 24px; }

  /* Hero: facts, then the three terms, then the button. The decorative loop is a desktop element. */
  .hero { padding-block: 28px 16px; }
  .hero-copy { display: flex; flex-direction: column; }
  .facts { order: 3; margin-top: 22px; }
  .hero-note { order: 4; margin-top: 18px; flex-direction: column; align-items: flex-start; gap: 8px; font-size: 0.95rem; }
  .hero-actions { order: 5; margin-top: 22px; flex-direction: column; align-items: stretch; gap: 4px; }
  .closed-note { order: 6; }
  .hero-actions .btn { width: 100%; justify-content: center; }
  .link-quiet { align-self: center; display: inline-flex; align-items: center; min-height: 44px; font-size: 0.95rem; }
  .hero-loop { display: none; }
  .hero-footnote { margin-top: 8px; font-size: 0.8125rem; }

  /* Who: three names as a statement, without table rules. */
  .who-list { display: grid; gap: 6px; }
  .who-list::before { display: none; }
  .who-list li, .who-list li + li { padding: 0; border: 0; display: flex; align-items: center; gap: 12px; }
  .who-list li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--green-line); flex: none; }
  .who-list h3 { font-size: 1.5rem; font-weight: 800; }
  .who-spouses { margin-top: 18px; font-size: 1.0625rem; color: var(--ink-soft); }

  /* Bootstrap principles and commitment list: the one bullet. */
  .gets > div { padding-block: 16px; }
  .gets dt { font-size: 1.125rem; }
  .gets dt::before { width: 6px; height: 6px; border: 0; background: var(--green-line); vertical-align: 4px; margin-inline-end: 10px; }
  .gets dd { padding-inline-start: 16px; }
  .approach-grid > div > p.equity { width: auto; margin-top: 24px; padding: 14px 18px; font-size: 1.0625rem; }
  /* On a phone the lit box turns the site's deep green, without the neon fill and glow. */
  .approach-grid > div > p.equity.is-lit { background: var(--green-deep); color: var(--white); box-shadow: none; }
  /* Level 3 likewise: the darkest green of the three steps, no neon fill or glow. */
  .level-3 { --c: var(--green-darker); --fg: var(--white); }
  .level-3 .level-bar { box-shadow: none; }
  /* Comfortable tap sizes: the header button and the partner logo links. */
  .site-header .btn-small { min-height: 44px; }
  .partner-logos a { min-height: 48px; align-items: center; }
  .team .board { font-size: 0.875rem; }
  .equity.is-lit strong { color: var(--white); }
  .commit-list li { padding-block: 12px; padding-inline-start: 18px; }
  .commit-list li::before { width: 6px; height: 6px; border: 0; background: var(--green-line); top: 1.35em; }

  /* Partners: optical sizing, so no logo shouts over the others. */
  .partner-logos { gap: 24px 20px; margin-top: 20px; }
  .partner-logos img { height: 56px; }
  .partner-logos .p-wix { height: 30px; }
  .partner-logos .p-guts { height: 30px; }
  .partner-logos .p-nba { height: 43px; }
  .partner-logos .p-matan { height: 58px; }

  /* Track: the stop number sits inside its ring. */
  .stops::before { inset-inline-start: 13px; }
  .track-start::before { margin-inline-start: -2px; }
  .track-end { padding-inline-start: 6px; }
  .stop, .stops .stop.row2 { grid-template-columns: 32px minmax(0, 1fr); column-gap: 16px; padding: 10px 0; }
  .stop .dot, .stop.row2 .dot { width: 32px; height: 32px; border-width: 3px; grid-row: 1 / span 2; }
  .stop .n, .stop.row2 .n { grid-column: 1; grid-row: 1 / span 2; align-self: center; justify-self: center; z-index: 1; font-weight: 700; font-size: 0.9rem; }
  .stop .t, .stop.row2 .t { grid-column: 2; font-size: 1.0625rem; }
  .stop .d, .stop.row2 .d { grid-column: 2; font-size: 0.9375rem; }
  .stop .when, .stop.row2 .when { grid-column: 2; font-size: 0.8125rem; }

  /* Steps and journey: the same ring as the track; only the last one is filled. */
  .steps { grid-template-columns: 1fr; row-gap: 20px; }
  .steps li::after { display: none; }
  .steps li { display: grid; grid-template-columns: 32px minmax(0, 1fr); column-gap: 14px; padding-top: 0; }
  .step-n { grid-column: 1; grid-row: 1 / span 2; width: 32px; height: 32px; font-size: 0.9rem; border-width: 2px; padding: 2px; }
  .steps h3, .steps p { grid-column: 2; }
  .steps h3 { margin-top: 2px; }
  .milestones li { padding-block: 18px 20px; }
  .milestones h3::before { width: 32px; height: 32px; font-size: 0.9rem; }
  .milestones p { padding-inline-start: calc(32px + 12px); }

  /* Details repeat the hero facts word for word, so the phone skips them. */
  .apply-grid > div:has(.detail-list) { display: none; }
  /* English terms inside Hebrew lines ("Demo Day", "CRM") stay on one line. */
  bdi { white-space: nowrap; }
  .apply-grid { margin-top: 40px; padding-top: 28px; }

  /* People carousels: the row runs to the screen edge, cards stay compact, a counter replaces the arrows. */
  .lecturers-head { flex-direction: column; align-items: stretch; gap: 0; }
  .carousel-nav { display: none; }
  .lecturer-track { margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter); grid-auto-columns: 64vw; gap: 16px; padding-block: 4px 12px; }
  .lecturer .face { max-width: 152px; }
  .lecturer .name { margin-top: 14px; font-size: 1.0625rem; }
  .lecturer .role { font-size: 0.9375rem; margin-bottom: 0; }
  .in-link { margin-top: 6px; translate: none; min-height: 44px; display: inline-flex; align-items: center; }
  .team { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
  /* Two columns: the closing card sits bottom-right, so the card before it moves beside it (bottom-left). */
  .team li:has(+ .team-end) { order: 1; }
  .team .name { font-size: 1rem; }
  .team .role { font-size: 0.875rem; }

  /* FAQ */
  .faq summary { padding-block: 16px; font-size: 1.0625rem; }
  .faq details p { padding-bottom: 18px; }

  /* Closing band and buttons */
  .cta-loop { display: none; }
  .cta h2 { font-size: 1.75rem; }
  .cta p { margin: 12px 0 24px; font-size: 1.0625rem; }
  .outcomes-cta { margin-top: 28px; }
  .outcomes-cta .btn, .cta .btn { width: 100%; justify-content: center; }

  /* Footer: logo, one line about, links, copyright. */
  .site-footer { padding-block: 28px 36px; }
  .footer-inner { flex-direction: column; align-items: flex-start; gap: 10px; }
  .footer-logo { display: block; height: 36px; width: auto; }
  .footer-sep { display: none; }
  .footer-copy { display: block; margin-top: 6px; font-size: 0.8125rem; }
  .footer-links { gap: 0 20px; }
  .footer-links a { display: inline-flex; align-items: center; min-height: 44px; }

  /* Pressed feedback on everything tappable, not only the buttons. */
  .nav-links a:active, .faq summary:active, .in-link:active, .link-quiet:active, .footer-links a:active { background: var(--green-wash); border-radius: 8px; }

  /* Menu: mark the section in view. */
  .nav-links a[aria-current="true"] { color: var(--green-deep); font-weight: 700; }

  /* ---- Lighter pass: more air, fewer rules and frames, softer weights. ---- */
  .who, .track, .people, .faq, .approach, .outcomes, .apply, .lecturers, .network { padding-block: 64px; }
  .partners-sec { padding-block: 48px; }
  .cta { padding-block: 56px; }
  .section-title { font-size: 1.625rem; }
  .section-sub { margin-top: 14px; }
  .who-list, .milestones, .steps, .team, .lecturer-track, .track-board { margin-top: 32px; }

  /* Hero terms: plain checked lines instead of three filled pills. */
  .hero-note { gap: 6px; font-weight: 400; color: var(--ink-soft); }
  .hero-note li { padding: 0; background: none; border-radius: 0; }

  .who-list { gap: 10px; }
  .who-list h3 { font-size: 1.375rem; font-weight: 700; }

  /* Lists separated by space, not by hairlines. */
  .gets > div, .gets > div:last-child { border: 0; padding-block: 12px; }
  .commit-list li { border: 0; padding-block: 8px; }
  .commit-list li::before { top: 1.15em; }
  .milestones li { border: 0; padding-block: 12px; }
  .network-list li, .network-list li:last-child { border: 0; padding-block: 14px; }
  .apply-grid { border: 0; margin-top: 48px; padding-top: 0; }
  .equity { box-shadow: none; }
  .steps { row-gap: 24px; }

  /* Success levels on a phone: the staircase turns into three bars that grow in length. */
  .levels { padding-block: 64px; }
  .level-steps { margin-top: 28px; grid-template-columns: 1fr; gap: 22px; }
  .level-bar { margin-top: 0; height: 52px; width: calc(var(--w) * var(--grow)); padding: 12px 18px; align-items: center; border-radius: 12px; white-space: nowrap; }
  .level-1 { --w: 52%; }
  .level-2 { --w: 76%; }
  .level-3 { --w: 100%; }
  .level-bar::after { top: 50%; translate: 0 -50%; inset-inline-start: auto; inset-inline-end: 16px; width: 26px; height: 26px; }
  .level-n { font-size: 1.0625rem; }
  .level-t { margin-top: 8px; font-size: 1.125rem; }
  /* The bars grow from the right edge (RTL start). */

  /* Tap-to-open descriptions (track, Bootstrap principles, journey): the title row is the control. */
  .fold { cursor: pointer; }
  .stop.fold .d, .gets > div.fold dd, .milestones li.fold p { display: none; }
  .stop.fold.is-open .d, .gets > div.fold.is-open dd, .milestones li.fold.is-open p { display: block; }
  /* The toggle is its own cell at the row's far end, so it never lands inside an English (LTR) title. */
  .fold-btn {
    width: 36px; height: 36px; border: 0; border-radius: 50%; background: transparent; padding: 0;
    display: grid; place-items: center; cursor: pointer; color: var(--green-deep); align-self: center;
  }
  .fold-btn::before { content: ""; width: 11px; height: 11px; border-right: 2.5px solid currentColor; border-bottom: 2.5px solid currentColor; transform: translateY(-3px) rotate(45deg); transition: transform 0.25s var(--ease); }
  /* Closed stops have one row, so ring, number and title share it and centre together. */
  /* Ring and number span the title and date rows, so the pair centres on the ring. */
  .stop.fold .dot, .stop.fold .n { grid-row: 1 / span 2; }
  .stop.fold .t { align-self: end; }
  .stop.fold .when { align-self: start; }
  .stop.fold .fold-btn { grid-row: 1 / span 2; }
  .is-open > .fold-btn::before { transform: translateY(2px) rotate(-135deg); }
  .stop.fold, .stops .stop.row2.fold { grid-template-columns: 32px minmax(0, 1fr) 36px; padding-block: 6px; }
  .stop.fold .fold-btn { grid-column: 3; grid-row: 1; }
  .gets > div.fold, .milestones li.fold { display: grid; grid-template-columns: minmax(0, 1fr) 36px; column-gap: 8px; align-items: center; }
  .gets > div.fold > dt, .milestones li.fold > h3 { grid-column: 1; grid-row: 1; }
  .gets > div.fold > .fold-btn, .milestones li.fold > .fold-btn { grid-column: 2; grid-row: 1; }
  .gets > div.fold > dd, .milestones li.fold > p { grid-column: 1 / -1; }
  /* The chevron already marks each row, so the folded rows drop their dot. */
  .gets > div.fold > dt::before { content: none; }
  .gets > div.fold > dd { padding-inline-start: 0; }
}
/* Open menu (≤1100px only exists): lock the page and dim it under the header (z-index 20). */
html.menu-lock, html.menu-lock body { overflow: hidden; }
html.menu-lock body::after { content: ""; position: fixed; inset: 0; z-index: 19; background: rgba(31, 36, 33, 0.38); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* Phone success levels: the bars grow in length, animating width directly so iPhone Safari runs it too. */
@media (max-width: 520px) and (prefers-reduced-motion: no-preference) {
  .js .level-bar, .js .level-steps.is-visible .level-bar { height: 52px; margin-top: 0; }
  .js .level-bar { width: 0; transition: width 1.15s cubic-bezier(0.22, 1, 0.36, 1); transition-delay: calc(var(--i) * 380ms); }
  .js .level-steps.is-visible .level-bar { width: var(--w); }
}
/* Two-column partner grid: Matan's heart sits above its wordmark, so the logo is nudged up to line up with Naschitz. */
@media (max-width: 820px) {
  .partner-logos .p-matan { translate: 0 -4px; }
}

/* Team: a name always stays on one line (e.g. "Tal Ben-Nissan Ziv"). */
.team .name { white-space: nowrap; }
/* Six narrow columns (961-1100px): a slightly smaller name still fits its card. */
@media (min-width: 961px) and (max-width: 1100px) { .team .name { font-size: 0.95rem; } }

/* Requirements list: balanced line breaks, so no word is left alone on a line. */
.commit-list li { text-wrap: pretty; }

/* Phone polish from the second mobile audit. */
@media (max-width: 520px) {
  /* Application steps: same 32px ring and 3px line as the track; the number sits on a small disc in the middle,
     so it is always on one background while the quarters still fill around it. */
  .steps li:nth-child(n) .step-n {
    border-width: 3px; padding: 2px;
    background:
      radial-gradient(circle, var(--sand) 0 7px, transparent 7.5px) content-box,
      conic-gradient(var(--green-deep) calc(var(--p) * 360deg), transparent 0) content-box;
    color: var(--green-darker); text-shadow: none; font-size: 0.8125rem;
  }
  /* One type scale: 15 / 18 / 19 instead of near-twins (15.2, 18.4, 19.2). */
  .hero-note li, .link-quiet, .footer-about, .footer-links a, .track-cap, .btn-small { font-size: 0.9375rem; }
  .nav-links a, .facts strong { font-size: 1.125rem; }
  .partners-title { font-size: 1.1875rem; }
  /* Footer: a taller tap area for the 8200 link, without changing how the line looks. */
  .footer-about a { display: inline-block; padding-block: 11px; margin-block: -11px; }
}

/* Participating communities: a logo wall, 8 per row on a computer, 6 on a tablet, 4 on a phone.
   Each logo sits in the same 3:2 cell; --h (set per logo) scales it so wide wordmarks and round badges carry similar weight.
   An unfinished last row is centred. */
.communities-sec { padding-block: clamp(48px, 6vw, 80px); }
.community-logos { --cols: 8; --gap-x: 28px; margin-top: 28px; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: center; gap: 28px var(--gap-x); }
/* The cell is a fixed 3:2 box; the logo is placed inside it, so its height can be a share (--h) of the cell. */
.community-logos li { position: relative; flex: 0 0 calc((100% - (var(--cols) - 1) * var(--gap-x)) / var(--cols)); aspect-ratio: 3 / 2; min-width: 0; }
.community-logos img { position: absolute; inset: 0; margin: auto; height: calc(var(--h) * 0.85); width: auto; max-width: 100%; object-fit: contain; }
@media (prefers-reduced-motion: no-preference) {
  .js .community-logos li { opacity: 0; transform: translateY(10px); transition: opacity 0.5s ease-out, transform 0.6s var(--ease); transition-delay: calc(var(--i) * 28ms); }
  .js .community-logos.is-visible li { opacity: 1; transform: none; }
}
@media (max-width: 820px) { .community-logos { --cols: 6; --gap-x: 16px; gap: 22px var(--gap-x); } }
@media (max-width: 520px) { .community-logos { --cols: 4; --gap-x: 12px; gap: 18px var(--gap-x); margin-top: 20px; } }

/* Partners: five equal columns on wider screens, every logo centred in its column.
   Heights come from one shared visible area, so the wide wordmarks (GUTS, NBA) and the tall marks (8200, Matan) look the same weight.
   --u scales the whole set per screen size. */
.partner-logos { --u: 1; }
.partner-logos img { height: calc(67px * var(--u)); max-width: 100%; }
.partner-logos .p-8200 { height: calc(67px * var(--u)); }
.partner-logos .p-matan { height: calc(74px * var(--u)); }
.partner-logos .p-wix { height: calc(46px * var(--u)); }
.partner-logos .p-nba { height: calc(47px * var(--u)); }
.partner-logos .p-guts { height: calc(34px * var(--u)); }
@media (min-width: 821px) {
  .partner-logos { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: center; justify-items: center; gap: 32px clamp(16px, 3vw, 40px); }
  .partner-logos li { width: 100%; min-width: 0; }
  .partner-logos a { width: 100%; display: flex; justify-content: center; }
}
@media (max-width: 820px) { .partner-logos { --u: 0.9; } }
@media (max-width: 520px) { .partner-logos { --u: 0.78; } }
/* Partners on tablets and phones: two balanced rows instead of 2+2+1.
   The three compact marks (8200, Wix, Matan) share the top row; the two wide wordmarks (NBA, GUTS) share the second. */
@media (max-width: 820px) {
  .partner-logos { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 28px 12px; align-items: center; justify-items: center; }
  .partner-logos li, .partner-logos li:last-child:nth-child(odd) { grid-column: span 2; width: 100%; min-width: 0; }
  .partner-logos li:has(.p-nba), .partner-logos li:has(.p-guts), .partner-logos li:last-child:nth-child(odd):has(.p-guts) { grid-column: span 3; order: 2; }
  .partner-logos a { width: 100%; display: flex; justify-content: center; }
  .partner-logos .p-wix { height: calc(42px * var(--u)); }
}
/* Success levels on a phone: level 1 keeps only "ולידציה על הבעיה והפתרון"; the full line stays on wider screens. */
@media (max-width: 520px) { .level-more { display: none; } }