/* Lectures (/ai-ed/): the Hebrew, right-to-left sub-site. Builds on site.css; Hebrew glyphs fall
   through each Latin face to Frank Ruhl Libre (serif) or Heebo (labels). */
:root {
  --f-display: "Instrument Serif", "Frank Ruhl Libre", "Times New Roman", serif;
  --f-body: "Newsreader", "Frank Ruhl Libre", Georgia, serif;
  --f-mono: "Geist Mono", "Heebo", ui-monospace, Menlo, monospace;
}

/* Hebrew has no true italic: emphasis stays upright and cobalt. Latin runs keep the italic. */
[dir="rtl"] em { font-style: normal; }
[dir="rtl"] em .lat, .lat em { font-style: italic; }
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3 { letter-spacing: 0; }
[dir="rtl"] .hero h1 { font-size: clamp(46px, 7.2vw, 100px); line-height: 1.06; letter-spacing: -.01em; }
[dir="rtl"] h2 { line-height: 1.12; }
[dir="rtl"] .label, [dir="rtl"] .nav ul a, [dir="rtl"] .btn, [dir="rtl"] footer .wrap, [dir="rtl"] .stats span, [dir="rtl"] .field label { letter-spacing: .01em; }
[dir="rtl"] .label { font-size: 12.5px; }
[dir="rtl"] .nav ul a { font-size: 13px; }
[dir="rtl"] .btn { font-size: 14px; }
[dir="rtl"] p { font-size: 1.04em; }
.lat { direction: ltr; unicode-bidi: isolate; }

/* arrows point the reading direction */
[dir="rtl"] .btn:hover .arr { transform: translateX(-4px); }

/* nav: animated orrery logo + sub-site name */
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.brand canvas { width: 64px; height: 40px; display: block; }
.brand .name { font: 400 22px/1 var(--f-display); }
.brand .name span { color: var(--sun); }
.brand .sub { font: 400 13px/1 var(--f-mono); letter-spacing: .02em; color: var(--ion); border-inline-start: 1px solid var(--line); padding-inline-start: 10px; }
.nav .lang { font: 400 11px/1 var(--f-mono); letter-spacing: .12em; color: var(--faint); text-decoration: none; padding-block: 15px; }
.nav .lang:hover { color: var(--ink); }

/* hero readout of impact numbers */
.stats { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 56px; border-top: 1px solid var(--line); max-width: 760px; animation: rise 1.2s 1.25s var(--ease) both; }
.stats div { padding: 16px 0 0; padding-inline-end: 14px; display: grid; gap: 6px; min-width: 0; }
.stats div + div { padding-inline-start: 14px; border-inline-start: 1px solid var(--line); }
.stats b { font: 400 clamp(30px, 4vw, 42px)/1 var(--f-display); color: var(--ink); font-variant-numeric: tabular-nums; direction: ltr; unicode-bidi: isolate; justify-self: start; }
.stats span { font: 400 12px/1.4 var(--f-mono); color: var(--dim); }
.stats i { font-style: normal; color: var(--ion); }

/* lectures: two programs side by side, each a column of hairline rows */
.programs { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line); }
.program { padding: 32px 0 8px; padding-inline-end: 40px; display: grid; gap: 18px; align-content: start; min-width: 0; }
.program + .program { padding-inline-start: 40px; padding-inline-end: 0; border-inline-start: 1px solid var(--line); }
.program .k { font-size: 12px; }
.program h3 { font-size: clamp(32px, 3.6vw, 44px); line-height: 1.05; }
.program .lede { font-size: 20px; color: var(--ink); max-width: 40ch; }
.steps { list-style: none; margin: 6px 0 0; padding: 0; border-top: 1px solid var(--line); }
.steps li { display: grid; grid-template-columns: 64px 1fr; gap: 14px; padding-block: 14px; border-bottom: 1px solid var(--line); align-items: baseline; }
.steps .k { direction: ltr; unicode-bidi: isolate; text-align: start; }
.steps p { font-size: 17px; }
.takeaway { display: grid; gap: 10px; padding: 18px 20px; background: rgba(255, 168, 82, 0.07); border-inline-start: 2px solid var(--sun); }
.takeaway .label { font-size: 12px; }
.takeaway p { font-size: 17px; color: var(--ink); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chips span { font: 400 13px/1 var(--f-mono); padding: 9px 12px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink); background: rgba(251, 249, 246, .7); }

/* audience cells */
.cells { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); }
.cells > div { padding: 22px 0 6px; padding-inline-end: 20px; display: grid; gap: 10px; align-content: start; min-width: 0; }
.cells > div + div { padding-inline-start: 20px; border-inline-start: 1px solid var(--line); }
.cells h3 { font-size: 24px; }
.cells p { font-size: 16px; }

/* vision quote */
.vision { display: grid; gap: 28px; }
.vision blockquote { margin: 0; font: 400 clamp(34px, 5vw, 62px)/1.15 var(--f-display); color: var(--ink); max-width: 22ch; text-wrap: balance; }
.vision .en { font: 400 12px/1.5 var(--f-mono); letter-spacing: .1em; color: var(--faint); direction: ltr; text-align: end; }
.vision .en a { color: var(--ion); }

/* about: credential row (mirrors .creds for RTL) */
[dir="rtl"] .creds li + li { border-left: 0; padding-left: 0; border-inline-start: 1px solid var(--line); padding-inline-start: 14px; }
[dir="rtl"] .creds li { padding-right: 0; padding-inline-end: 14px; }
[dir="rtl"] .creds .k { direction: ltr; unicode-bidi: isolate; justify-self: start; }

/* contact: channels + form */
.channels { display: grid; grid-template-columns: repeat(2, 1fr); max-width: 760px; border-top: 1px solid var(--line); }
.channel { display: grid; gap: 8px; padding: 22px 0 22px; padding-inline-end: 20px; text-decoration: none; min-width: 0; position: relative; }
.channel + .channel { padding-inline-start: 20px; border-inline-start: 1px solid var(--line); }
.channel b { font: 400 26px/1.1 var(--f-display); color: var(--ink); }
.channel span:not(.k) { font: 400 14px/1.4 var(--f-mono); color: var(--dim); direction: ltr; unicode-bidi: isolate; text-align: end; justify-self: start; }
.channel:hover b { color: var(--ion); }
.channel[hidden] { display: none !important; }

.form { display: grid; gap: 18px; max-width: 640px; padding-top: 8px; }
.form .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.field { display: grid; gap: 8px; min-width: 0; }
.field label { font: 400 12px/1 var(--f-mono); letter-spacing: .06em; color: var(--dim); }
.field input, .field select, .field textarea {
  font: 300 18px/1.4 var(--f-body); color: var(--ink); background: rgba(251, 249, 246, .8);
  border: 0; border-bottom: 1px solid var(--faint); border-radius: 0; padding: 10px 2px; min-height: 44px; width: 100%;
  transition: border-color .3s;
}
.field textarea { min-height: 110px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-bottom-color: var(--ion); box-shadow: 0 1px 0 var(--ion); }
.form .note { font: 400 12px/1.5 var(--f-mono); color: var(--faint); }
button.btn { cursor: pointer; justify-self: start; min-height: 46px; }

@media (max-width: 960px) {
  .programs, .channels { grid-template-columns: 1fr; }
  .program, .program + .program { padding-inline: 0; border-inline-start: 0; }
  .program + .program { border-top: 1px solid var(--line); margin-top: 24px; }
  .channel, .channel + .channel { padding-inline: 0; border-inline-start: 0; }
  .channel + .channel { border-top: 1px solid var(--line); }
  .cells { grid-template-columns: repeat(2, 1fr); }
  .cells > div:nth-child(3) { padding-inline-start: 0; border-inline-start: 0; }
  .cells > div:nth-child(n+3) { border-top: 1px solid var(--line); }
}
@media (max-width: 620px) {
  .brand .sub { display: none; }
  .nav .lang { display: none; }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .stats div:nth-child(3) { padding-inline-start: 0; border-inline-start: 0; }
  .stats div:nth-child(n+3) { border-top: 1px solid var(--line); margin-top: 14px; }
  .cells { grid-template-columns: 1fr; }
  .cells > div, .cells > div + div { padding-inline: 0; border-inline-start: 0; }
  .cells > div + div { border-top: 1px solid var(--line); }
  .form .row2 { grid-template-columns: 1fr; }
  [dir="rtl"] .creds li + li { border-inline-start: 0; padding-inline-start: 0; }
  .steps li { grid-template-columns: 52px 1fr; }
}

.form { position: relative; }
button.btn:disabled { opacity: .55; cursor: progress; }
.hp { position: absolute; inset-inline-start: 0; bottom: 0; width: 1px; height: 1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); opacity: 0; }