/* ============================================================================
   The Third Beis HaMikdash — production stylesheet
   Direction: "Luminous Limestone / Daylight"
     Palette   limestone #f4ecdb · paper #faf6ec · ink #2a2318
               deep gold #b0842f · light gold #e6c66a · sky #2f6db0
     Type      display: Iowan Old Style / Palatino (classical, reverent)
               body:    system humanist sans
     Signature the "amah rule" — a fine gold measured tick-rule echoing the
               Mikdash's cited dimensions, set under every eyebrow.
   Mobile-first. Respects prefers-reduced-motion. No external resources.
   ============================================================================ */

*, *::before, *::after { box-sizing: border-box; }

:root {
  --stone:#f4ecdb; --paper:#faf6ec; --stone-deep:#ece0c9; --stone-warm:#f0e6d1;
  --ink:#2a2318; --ink-soft:#5b4f3d; --faint:#8a7c64;
  --gold:#b0842f; --gold-lite:#e6c66a; --gold-deep:#8a6320;
  --sky:#2f6db0; --sky-deep:#255a92;
  --line:rgba(42,35,24,.14); --line-soft:rgba(42,35,24,.08);
  --ok:#2f7d4f; --err:#b23b2e;
  --shadow-lg:24px 40px 80px -44px rgba(58,44,20,.55);
  --shadow-md:0 18px 40px -26px rgba(58,44,20,.5);
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --shell:1180px;
  --radius:16px;
}

html { scroll-behavior: smooth; }
body {
  margin:0; background:var(--stone); color:var(--ink);
  font-family:var(--sans); line-height:1.65;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
html.modal-open, html.nav-open body { overflow:hidden; }

img { max-width:100%; display:block; }
a { color:inherit; }

/* בס״ד — small inscription, top-right of the page */
.bsd{
  position:fixed; top:6px; right:14px; z-index:300;
  font-family:var(--serif); font-size:12px; letter-spacing:.03em;
  color:var(--ink-soft); opacity:.72; pointer-events:none;
}
@media (max-width:760px){ .bsd{ font-size:11px; top:5px; right:10px; } }

/* Chazal pull-quote (Tisha B'Av section) */
.tisha-quote{ margin:1.7rem 0; padding:.2rem 0 .2rem 1.4rem; border-left:3px solid var(--gold); }
.tisha-quote .quote-he{ font-family:var(--serif); font-size:clamp(1.2rem,1rem+1.3vw,1.7rem); line-height:1.7; color:var(--paper); margin:0 0 .55rem; }
.tisha-quote .quote-en{ font-family:var(--serif); font-style:italic; font-size:clamp(1.02rem,.96rem+.45vw,1.22rem); color:rgba(250,246,236,.85); margin:0 0 .6rem; }
.tisha-quote cite{ font-style:normal; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-lite); }
h1,h2,h3 { font-family:var(--serif); font-weight:600; letter-spacing:-.01em; }

:focus-visible {
  outline:2px solid var(--sky);
  outline-offset:3px;
  border-radius:3px;
}

.shell { width:100%; max-width:var(--shell); margin-inline:auto; padding-inline:clamp(20px,5vw,56px); }
.section-pad { padding-block:clamp(3.6rem,9vw,7rem); }

/* --- accessibility helpers --- */
.sr-only {
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.skip-link {
  position:absolute; left:12px; top:-60px; z-index:200;
  background:var(--ink); color:var(--paper); padding:.7rem 1.1rem;
  border-radius:8px; text-decoration:none; transition:top .18s;
}
.skip-link:focus { top:12px; }

/* --- eyebrow / kicker + amah-rule signature --- */
.kicker {
  font-family:var(--sans); font-size:.72rem; font-weight:600; letter-spacing:.22em;
  text-transform:uppercase; color:var(--gold-deep); margin:0 0 1rem;
  display:flex; flex-direction:column; gap:.65rem;
}
.kicker::after {
  content:""; width:clamp(52px,9vw,88px); height:8px;
  background-image:repeating-linear-gradient(90deg,var(--gold) 0 1.5px,transparent 1.5px 8px);
  opacity:.85;
}
.kicker.ink { color:var(--gold-deep); }

.lead-serif {
  font-family:var(--serif); font-style:italic;
  font-size:clamp(1.2rem,2.4vw,1.65rem); line-height:1.45; color:var(--ink);
  margin:0 0 1.3rem;
}
.media-label, .concept-label {
  display:inline-block; font-size:.72rem; letter-spacing:.05em;
  color:#f4ead6; background:rgba(31,24,12,.72); padding:.4rem .7rem;
  border-radius:7px; backdrop-filter:blur(4px);
}
.text-link {
  color:var(--gold-deep); font-weight:600; text-decoration:none;
  border-bottom:1px solid rgba(176,132,47,.4); padding-bottom:1px;
  transition:border-color .2s,color .2s;
}
.text-link:hover { color:var(--ink); border-color:var(--gold); }
.text-button {
  background:none; border:none; padding:0; cursor:pointer; font:inherit;
  color:var(--gold-deep); font-weight:600; text-decoration:underline;
  text-underline-offset:3px; text-decoration-color:rgba(176,132,47,.4);
}
.text-button:hover { color:var(--ink); }

/* ============ buttons ============ */
.button {
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  font-family:var(--sans); font-size:1rem; font-weight:600; line-height:1;
  text-decoration:none; cursor:pointer; white-space:nowrap;
  padding:.92rem 1.7rem; border-radius:999px; border:1px solid transparent;
  transition:transform .18s, box-shadow .18s, background .2s, color .2s;
}
.button:hover { transform:translateY(-2px); }
.button:active { transform:translateY(0); }
.button-gold {
  background:linear-gradient(160deg,var(--gold-lite),var(--gold)); color:#3a2a08;
  box-shadow:0 14px 34px -16px rgba(176,132,47,.9);
}
.button-gold:hover { box-shadow:0 20px 44px -16px rgba(176,132,47,1); }
.button-ink { background:var(--ink); color:var(--paper); }
.button-ink:hover { background:#3a3020; }
.button-light {
  background:rgba(250,246,236,.12); color:#fdf7ea;
  border-color:rgba(253,247,234,.5); backdrop-filter:blur(6px);
}
.button-light:hover { background:rgba(250,246,236,.22); }
.button-outline { background:transparent; color:var(--gold-deep); border-color:var(--gold); }
.button-outline:hover { background:var(--gold); color:#fff; }
.button-meta { font-size:.78rem; font-weight:600; opacity:.75; letter-spacing:.02em; }
.play-icon {
  width:0; height:0; flex:none;
  border-left:11px solid currentColor; border-top:7px solid transparent;
  border-bottom:7px solid transparent; margin-right:.1rem;
}

/* ============ header / nav ============ */
.site-header {
  position:sticky; top:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.8rem clamp(20px,5vw,56px);
  background:rgba(250,246,236,.7); backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid transparent; transition:background .25s, border-color .25s, box-shadow .25s;
}
.site-header.is-scrolled {
  background:rgba(250,246,236,.94); border-bottom-color:var(--line);
  box-shadow:0 8px 26px -22px rgba(58,44,20,.7);
}
.brand { display:flex; align-items:center; gap:.7rem; text-decoration:none; color:var(--ink); }
.brand-mark {
  display:grid; place-items:center; width:38px; height:38px; border-radius:50%;
  border:1px solid var(--gold); color:var(--gold-deep); font-family:var(--serif);
  font-size:.82rem; background:linear-gradient(160deg,#fff8ec,#f0e3c6);
}
.brand strong { font-family:var(--serif); font-size:1.02rem; font-weight:600; display:block; line-height:1.12; }
.brand small { font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--faint); }
.site-nav { display:flex; align-items:center; gap:clamp(1rem,2.3vw,2rem); }
.site-nav a {
  text-decoration:none; font-size:.9rem; font-weight:500; color:var(--ink-soft);
  transition:color .2s;
}
.site-nav a:hover { color:var(--ink); }
.nav-donate {
  border:1px solid var(--gold); color:var(--gold-deep)!important; padding:.5rem 1.05rem;
  border-radius:999px; background:linear-gradient(160deg,#fff8ec,#f2e6c9); font-weight:600!important;
}
.nav-donate:hover { background:var(--gold); color:#fff!important; }
.menu-button {
  display:none; border:1px solid var(--line); background:var(--paper); border-radius:10px;
  width:44px; height:40px; cursor:pointer; position:relative;
}
.menu-lines, .menu-lines::before, .menu-lines::after {
  content:""; position:absolute; left:50%; width:18px; height:1.6px; background:var(--ink);
  transform:translateX(-50%); transition:transform .2s, opacity .2s;
}
.menu-lines { top:50%; margin-top:-.8px; }
.menu-lines::before { top:-6px; }
.menu-lines::after { top:6px; }
html.nav-open .menu-lines { background:transparent; }
html.nav-open .menu-lines::before { transform:translateX(-50%) translateY(6px) rotate(45deg); }
html.nav-open .menu-lines::after { transform:translateX(-50%) translateY(-6px) rotate(-45deg); }

/* ============ hero ============ */
.hero {
  position:relative; min-height:clamp(560px,92vh,940px);
  display:flex; align-items:flex-end; overflow:hidden;
}
.hero-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 42%; }
.hero-shade {
  position:absolute; inset:0;
  background:
    linear-gradient(to top,rgba(31,24,12,.84) 0%,rgba(31,24,12,.44) 34%,rgba(31,24,12,.06) 62%,transparent 82%),
    radial-gradient(120% 80% at 15% 100%,rgba(31,24,12,.5),transparent 60%);
}
.hero-content { position:relative; z-index:2; color:#fdf7ea; max-width:760px; padding-block:clamp(2.4rem,6vw,5rem); }
.hero .kicker { color:var(--gold-lite); text-shadow:0 1px 12px rgba(0,0,0,.4); }
.hero .kicker::after { background-image:repeating-linear-gradient(90deg,var(--gold-lite) 0 1.5px,transparent 1.5px 8px); }
.hero h1 {
  margin:0 0 1.1rem; font-size:clamp(2.9rem,8.5vw,6rem); line-height:.98;
  text-shadow:0 2px 40px rgba(0,0,0,.35);
}
.hero-lede {
  font-family:var(--serif); font-style:italic; font-size:clamp(1.15rem,2.5vw,1.55rem);
  line-height:1.5; max-width:40ch; color:#f4ead6; margin:0 0 2rem;
}
.hero-actions { display:flex; flex-wrap:wrap; gap:.9rem; margin-bottom:1.6rem; }
.hero-source { font-size:.8rem; color:rgba(253,247,234,.72); margin:0; letter-spacing:.02em; }
.hero-next {
  position:absolute; right:clamp(20px,5vw,56px); bottom:1.6rem; z-index:2;
  display:flex; align-items:center; gap:.5rem; color:rgba(253,247,234,.82);
  text-decoration:none; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase;
}
.hero-next span:last-child { animation:nudge 1.8s ease-in-out infinite; }
@keyframes nudge { 0%,100%{transform:translateY(0)} 50%{transform:translateY(4px)} }

/* ============ meaning / closeness ============ */
.meaning { background:linear-gradient(180deg,var(--stone),var(--paper)); }
.meaning-grid { display:grid; grid-template-columns:1fr; gap:clamp(1.4rem,4vw,3rem); align-items:start; }
.meaning h2 { font-size:clamp(2rem,5vw,3.4rem); line-height:1.05; margin:0; }
.meaning-copy p { margin:0 0 1.1rem; color:var(--ink-soft); font-size:1.06rem; max-width:56ch; }
.meaning-copy p:last-child { margin-bottom:0; }

/* ============ source ============ */
.source-section { background:var(--paper); border-top:1px solid var(--line-soft); }
.source-grid { display:grid; grid-template-columns:1fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.source-visual { position:relative; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-lg); border:1px solid var(--line); }
.source-visual img { width:100%; aspect-ratio:4/3; object-fit:cover; background:#efe6d2; }
.source-visual .media-label { position:absolute; left:14px; bottom:14px; }
.source-copy h2 { font-size:clamp(1.8rem,4.4vw,3rem); margin:0 0 1.2rem; }
.source-copy p { color:var(--ink-soft); margin:0 0 1.1rem; max-width:52ch; }
.source-number { display:flex; align-items:baseline; gap:.8rem; margin:0 0 1.4rem!important; }
.source-number strong { font-family:var(--serif); font-size:clamp(3rem,8vw,4.6rem); line-height:1; color:var(--gold-deep); }
.source-number span { font-size:.8rem; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); }

/* ============ section heading ============ */
.section-heading { margin:0 0 clamp(2rem,5vw,3.2rem); }
.section-heading.narrow { max-width:640px; margin-inline:auto; text-align:center; }
.section-heading.narrow .kicker { align-items:center; }
.section-heading h2 { font-size:clamp(1.9rem,5vw,3.2rem); line-height:1.06; margin:0 0 1rem; }
.section-heading p { color:var(--ink-soft); font-size:1.05rem; margin:0; }

/* ============ experience: mode tool ============ */
.experience { background:linear-gradient(180deg,var(--paper),var(--stone)); }
.mode-tool {
  background:var(--paper); border:1px solid var(--line); border-radius:calc(var(--radius) + 6px);
  box-shadow:var(--shadow-md); overflow:hidden;
}
.mode-tabs { display:flex; gap:.4rem; padding:.5rem; background:var(--stone-warm); border-bottom:1px solid var(--line); }
.mode-tabs [role="tab"] {
  flex:1; font:inherit; font-weight:600; cursor:pointer; padding:.85rem 1rem;
  border:1px solid transparent; border-radius:12px; background:transparent; color:var(--ink-soft);
  transition:background .2s, color .2s, box-shadow .2s;
}
.mode-tabs [role="tab"][aria-selected="true"] {
  background:var(--paper); color:var(--ink); border-color:var(--line);
  box-shadow:0 6px 18px -12px rgba(58,44,20,.6);
}
.mode-panel { display:grid; grid-template-columns:1fr; gap:0; }
.mode-panel[hidden] { display:none; }
.mode-media { position:relative; min-height:240px; background:#efe6d2; }
.mode-media img { width:100%; height:100%; object-fit:cover; aspect-ratio:16/11; }
.mode-media .media-label { position:absolute; left:14px; bottom:14px; }
.realtime-media .camera-frame {
  position:absolute; inset:14px; pointer-events:none;
}
.camera-frame span {
  position:absolute; width:20px; height:20px; border:2px solid rgba(255,255,255,.8);
}
.camera-frame span:nth-child(1){ top:0; left:0; border-right:0; border-bottom:0; }
.camera-frame span:nth-child(2){ top:0; right:0; border-left:0; border-bottom:0; }
.camera-frame span:nth-child(3){ bottom:0; left:0; border-right:0; border-top:0; }
.camera-frame span:nth-child(4){ bottom:0; right:0; border-left:0; border-top:0; }
.mode-interface { padding:clamp(1.4rem,3.5vw,2.4rem); }
.interface-label { font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); margin:0 0 1rem; }
.choice-list { display:grid; gap:.6rem; margin-bottom:1.4rem; }
.choice {
  display:grid; grid-template-columns:auto 1fr; gap:.2rem 1rem; align-items:start;
  text-align:left; font:inherit; cursor:pointer; padding:.9rem 1.1rem;
  background:var(--stone-warm); border:1px solid var(--line); border-radius:12px;
  transition:border-color .2s, background .2s, transform .15s;
}
.choice:hover { transform:translateX(2px); }
.choice span { grid-row:1/3; font-family:var(--serif); color:var(--gold-deep); font-size:1.1rem; }
.choice strong { font-size:1rem; }
.choice small { grid-column:2; color:var(--ink-soft); font-size:.9rem; }
.choice.is-selected { border-color:var(--gold); background:linear-gradient(160deg,#fff8ec,#f4e8cd); }
.choice-detail {
  border-left:3px solid var(--gold); padding:.4rem 0 .4rem 1.1rem;
  display:grid; gap:.3rem;
}
.choice-detail [data-choice-eyebrow] { font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-deep); }
.choice-detail strong { font-family:var(--serif); font-size:1.15rem; }
.choice-detail p { margin:0; color:var(--ink-soft); font-size:.95rem; }

/* real-time interface */
.jerusalem-clock {
  display:flex; align-items:baseline; gap:.6rem; flex-wrap:wrap;
  padding:1rem 1.2rem; background:var(--ink); color:var(--paper);
  border-radius:12px; margin-bottom:1.4rem;
}
.jerusalem-clock span { font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; opacity:.7; }
.jerusalem-clock strong {
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  font-size:clamp(1.8rem,5vw,2.4rem); font-weight:600; letter-spacing:.02em;
}
.jerusalem-clock small { font-size:.78rem; opacity:.65; width:100%; }
.dayline { position:relative; height:64px; margin:1.6rem 0 1.8rem; }
.dayline-track { position:absolute; left:0; right:0; top:12px; height:2px; background:var(--line); }
.dayline button {
  position:absolute; top:0; left:var(--point,0); transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:.3rem;
  background:none; border:none; cursor:pointer; font:inherit; color:var(--ink-soft);
  padding-top:20px;
}
.dayline button::before {
  content:""; position:absolute; top:6px; width:14px; height:14px; border-radius:50%;
  background:var(--paper); border:2px solid var(--gold); transition:background .2s, transform .2s;
}
.dayline button small { font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--faint); }
.dayline button strong { font-family:var(--serif); font-size:.9rem; color:var(--ink); }
.dayline button.is-selected::before { background:var(--gold); transform:scale(1.15); }
.dayline-now { position:absolute; top:5px; left:var(--now,50%); width:2px; height:16px; background:var(--gold-deep); transform:translateX(-50%); border-radius:2px; z-index:2; transition:left .6s linear; }
.dayline-now::after { content:"now"; position:absolute; top:-13px; left:50%; transform:translateX(-50%); font-size:.52rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-deep); font-weight:700; }
.dayline-now[hidden] { display:none; }

.share-buttons { display:flex; flex-wrap:wrap; gap:.5rem; margin:.3rem 0 .6rem; }
.share-link { font:inherit; font-size:.85rem; padding:.35rem .8rem; border:1px solid var(--line); border-radius:999px; color:var(--ink-soft); text-decoration:none; background:transparent; cursor:pointer; }
.share-link:hover, .share-link:focus-visible { border-color:var(--gold); color:var(--ink); }
.camera-choices > div { display:flex; flex-wrap:wrap; gap:.5rem; margin:.4rem 0 1rem; }
.camera-choices button {
  font:inherit; font-size:.88rem; cursor:pointer; padding:.5rem .95rem; border-radius:999px;
  border:1px solid var(--line); background:var(--stone-warm); color:var(--ink-soft); transition:all .18s;
}
.camera-choices button.is-selected { border-color:var(--gold); background:var(--gold); color:#fff; }
.camera-choices p { margin:0; color:var(--ink-soft); font-size:.95rem; }
.interface-note { margin:1.2rem 0 0; font-size:.9rem; color:var(--faint); font-style:italic; }

/* ============ walkthrough ============ */
.walkthrough { position:relative; min-height:clamp(420px,70vh,680px); display:flex; align-items:flex-end; overflow:hidden; }
.walkthrough img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.walk-shade {
  position:absolute; inset:0;
  background:linear-gradient(to top,rgba(31,24,12,.82),rgba(31,24,12,.28) 55%,transparent 85%);
}
.walk-copy { position:relative; z-index:2; color:#fdf7ea; max-width:640px; padding:clamp(2rem,5vw,4rem) clamp(20px,5vw,56px); }
.walk-copy .kicker { color:var(--gold-lite); }
.walk-copy .kicker::after { background-image:repeating-linear-gradient(90deg,var(--gold-lite) 0 1.5px,transparent 1.5px 8px); }
.walk-copy h2 { font-size:clamp(1.8rem,4.6vw,3rem); line-height:1.06; margin:0 0 1rem; }
.walk-copy p { color:#f4ead6; font-size:1.05rem; margin:0 0 1.2rem; }

/* ============ tisha ============ */
.tisha { background:var(--ink); color:var(--paper); }
.tisha .kicker { color:var(--gold-lite); }
.tisha .kicker::after { background-image:repeating-linear-gradient(90deg,var(--gold-lite) 0 1.5px,transparent 1.5px 8px); }
.tisha-grid { display:grid; grid-template-columns:1fr; gap:clamp(1.4rem,4vw,3rem); }
.tisha h2 { font-size:clamp(1.9rem,4.8vw,3rem); line-height:1.08; margin:0; color:var(--paper); }
.tisha .lead-serif { color:#f4ead6; }
.tisha p { color:rgba(244,234,214,.82); margin:0 0 1rem; }

/* ============ roadmap ============ */
.roadmap { background:var(--paper); }
.roadmap-list { list-style:none; margin:0 auto clamp(1.4rem,3vw,2rem); padding:0; max-width:820px; }
.roadmap-list li {
  position:relative; display:grid; grid-template-columns:auto 1fr; gap:1.2rem;
  padding:1.3rem 0 1.3rem 0; border-top:1px solid var(--line);
}
.roadmap-list li:first-child { border-top:none; }
.roadmap-list li > span {
  font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--faint);
  font-weight:600; padding-top:.35rem; min-width:64px;
}
.roadmap-list li.is-current > span { color:var(--gold-deep); }
.roadmap-list li strong { font-family:var(--serif); font-size:1.2rem; display:block; margin-bottom:.3rem; }
.roadmap-list li p { margin:0; color:var(--ink-soft); font-size:.98rem; }
.roadmap-list li.is-current::before {
  content:""; position:absolute; left:-14px; top:1.5rem; width:6px; height:6px; border-radius:50%;
  background:var(--gold);
}
.roadmap-note { text-align:center; max-width:680px; margin-inline:auto; color:var(--faint); font-size:.92rem; font-style:italic; }

/* ============ participate ============ */
.participate { background:linear-gradient(180deg,var(--stone),var(--paper)); }
.signup-band {
  display:grid; grid-template-columns:1fr; gap:1.5rem; align-items:center;
  background:var(--ink); color:var(--paper); border-radius:calc(var(--radius) + 6px);
  padding:clamp(1.6rem,4vw,2.6rem); margin-bottom:clamp(2rem,5vw,3rem);
}
.signup-band h3 { font-family:var(--serif); font-size:1.6rem; margin:.4rem 0 .5rem; }
.signup-band > div > p { margin:0; color:rgba(244,234,214,.8); }
.participation-number { font-family:var(--serif); font-size:1.1rem; color:var(--gold-lite); }
.signup-form label { display:block; font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(244,234,214,.7); margin-bottom:.5rem; }
.field-row { display:flex; gap:.6rem; flex-wrap:wrap; }
.field-row input {
  flex:1 1 220px; font:inherit; padding:.85rem 1rem; border-radius:12px;
  border:1px solid rgba(244,234,214,.28); background:rgba(244,234,214,.08); color:var(--paper);
}
.field-row input::placeholder { color:rgba(244,234,214,.5); }
.field-row input:focus-visible { outline-color:var(--gold-lite); background:rgba(244,234,214,.14); }
.form-note { font-size:.82rem; color:var(--faint); margin:.9rem 0 0; }
.signup-band .form-note { color:rgba(244,234,214,.6); }
.signup-band .form-note a { color:var(--gold-lite); }
.form-message { font-size:.9rem; margin:.7rem 0 0; min-height:1.2em; }
.form-message.is-error { color:var(--err); }
.form-message.is-success { color:var(--ok); }
.signup-band .form-message.is-error { color:#f0a79b; }
.signup-band .form-message.is-success { color:#a7dcb9; }

.participation-grid { display:grid; grid-template-columns:1fr; gap:1.4rem; }
.participation-column {
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:clamp(1.4rem,3vw,2rem); display:flex; flex-direction:column; gap:.6rem;
}
.participation-column h3 { font-family:var(--serif); font-size:1.3rem; margin:.2rem 0 .2rem; }
.participation-column > p { color:var(--ink-soft); font-size:.98rem; margin:0; }
.participation-column .participation-number { color:var(--gold-deep); }
.donate-column { background:linear-gradient(160deg,#fff8ec,#f3e7ca); border-color:var(--gold); }
.action-row { display:flex; flex-wrap:wrap; gap:.7rem; align-items:center; margin-top:.4rem; }
.downloads { display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; font-size:.9rem; color:var(--ink-soft); margin-top:.4rem; }
.downloads span { color:var(--faint); }
.downloads a { color:var(--gold-deep); font-weight:600; text-decoration:none; border-bottom:1px solid rgba(176,132,47,.35); }
.downloads a:hover { color:var(--ink); }
.donate-column .button { margin-top:auto; }

/* comment form */
.comment-form { display:grid; gap:.9rem; margin-top:.4rem; }
.comment-form[hidden] { display:none; }
.comment-form label { display:grid; gap:.35rem; font-size:.86rem; color:var(--ink-soft); }
.comment-form label span { color:var(--faint); font-weight:400; }
.comment-form input, .comment-form textarea {
  font:inherit; padding:.7rem .85rem; border-radius:10px; border:1px solid var(--line);
  background:var(--stone-warm); color:var(--ink); width:100%; resize:vertical;
}
.comment-form input:focus-visible, .comment-form textarea:focus-visible { outline-color:var(--gold); }
.two-fields { display:grid; grid-template-columns:1fr; gap:.9rem; }
.honeypot {
  position:absolute!important; left:-9999px!important; width:1px; height:1px;
  overflow:hidden; opacity:0;
}
.comments-disabled {
  background:var(--stone-warm); border:1px dashed var(--line); border-radius:12px;
  padding:1rem 1.2rem; color:var(--ink-soft); font-size:.95rem;
}
.comments-disabled p { margin:0; }

/* chizuk wall */
.chizuk-wall { margin-top:clamp(2.4rem,5vw,3.4rem); }
.chizuk-wall[hidden] { display:none; }
.chizuk-heading { text-align:center; margin-bottom:1.8rem; }
.chizuk-heading .kicker { align-items:center; }
.chizuk-heading h3 { font-family:var(--serif); font-size:clamp(1.6rem,4vw,2.2rem); margin:0; }
.chizuk-list { display:grid; grid-template-columns:1fr; gap:1.1rem; }
.chizuk-item {
  margin:0; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.4rem 1.5rem; box-shadow:var(--shadow-md);
}
.chizuk-item blockquote {
  margin:0 0 .9rem; font-family:var(--serif); font-style:italic; font-size:1.1rem;
  line-height:1.5; color:var(--ink); position:relative; padding-left:1.1rem;
}
.chizuk-item blockquote::before {
  content:"“"; position:absolute; left:-.1rem; top:-.2rem; font-size:2rem; color:var(--gold); line-height:1;
}
.chizuk-item figcaption { display:flex; flex-wrap:wrap; gap:.5rem; align-items:baseline; font-size:.9rem; }
.chizuk-item figcaption strong { color:var(--ink); }
.chizuk-item figcaption span { color:var(--faint); }
.chizuk-item figcaption span::before { content:"· "; }
.chizuk-state { text-align:center; color:var(--faint); font-style:italic; padding:1.4rem 0; }
[data-comments-more] { display:block; margin:1.4rem auto 0; }
[data-comments-more][hidden] { display:none; }

/* ============ faq ============ */
.faq { background:var(--paper); border-top:1px solid var(--line-soft); }
.faq-grid { display:grid; grid-template-columns:1fr; gap:clamp(1.6rem,4vw,3rem); align-items:start; }
.faq-grid > div:first-child h2 { font-size:clamp(1.8rem,4.4vw,2.8rem); margin:0; }
.faq-list details { border-top:1px solid var(--line); padding:1.1rem 0; }
.faq-list details:first-child { border-top:none; }
.faq-list summary {
  cursor:pointer; list-style:none; font-family:var(--serif); font-size:1.12rem; font-weight:600;
  display:flex; justify-content:space-between; align-items:center; gap:1rem; color:var(--ink);
}
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after {
  content:"+"; font-family:var(--sans); font-size:1.5rem; color:var(--gold-deep); line-height:1;
  transition:transform .2s;
}
.faq-list details[open] summary::after { transform:rotate(45deg); }
.faq-list details p { margin:.9rem 0 0; color:var(--ink-soft); font-size:1rem; max-width:64ch; }

/* ============ footer ============ */
.site-footer { background:var(--ink); color:var(--paper); padding:clamp(2.6rem,6vw,4rem) 0 2.2rem; }
.footer-grid { display:grid; grid-template-columns:1fr; gap:1.6rem; }
.footer-grid strong { font-family:var(--serif); font-size:1.15rem; display:block; margin-bottom:.5rem; }
.footer-grid span { font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-lite); display:block; margin-bottom:.4rem; }
.footer-grid p { margin:0; color:rgba(244,234,214,.75); font-size:.95rem; }
.footer-grid a { color:var(--gold-lite); text-decoration:none; }
.footer-grid a:hover { text-decoration:underline; }
.footer-boundary {
  max-width:var(--shell); margin:clamp(2rem,5vw,3rem) auto 0; padding:1.4rem clamp(20px,5vw,56px) 0;
  border-top:1px solid rgba(244,234,214,.16); color:rgba(244,234,214,.55); font-size:.85rem; text-align:center;
}

/* ============ video dialog ============ */
.video-dialog {
  border:none; padding:0; background:transparent; max-width:min(940px,94vw); width:100%;
  color:var(--ink); border-radius:var(--radius); overflow:hidden;
}
.video-dialog::backdrop { background:rgba(20,15,8,.72); backdrop-filter:blur(3px); }
.video-dialog-inner { background:var(--paper); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-lg); }
.video-dialog-head { display:flex; align-items:center; justify-content:space-between; padding:1rem 1.2rem; border-bottom:1px solid var(--line); }
.video-dialog-head h2 { margin:0; font-size:1.2rem; }
.video-dialog-head button {
  font-size:1.6rem; line-height:1; background:none; border:none; cursor:pointer; color:var(--ink-soft);
  width:40px; height:40px; border-radius:8px;
}
.video-dialog-head button:hover { background:var(--stone-warm); color:var(--ink); }
.video-dialog video { width:100%; display:block; background:#000; aspect-ratio:16/9; }
.video-dialog-inner > p { margin:0; padding:.9rem 1.2rem; font-size:.85rem; color:var(--faint); }

/* ============ privacy / doc pages ============ */
.page-doc { background:var(--paper); }
.doc-shell { max-width:760px; }
.doc h1 { font-size:clamp(2rem,5vw,3rem); margin:.4rem 0 1rem; }
.doc-lede { font-family:var(--serif); font-style:italic; font-size:clamp(1.15rem,2.4vw,1.5rem); color:var(--ink); margin:0 0 2.2rem; }
.doc section { margin-bottom:2rem; }
.doc h2 { font-size:1.4rem; margin:0 0 .8rem; }
.doc p, .doc li { color:var(--ink-soft); font-size:1.03rem; }
.doc ul { padding-left:1.2rem; }
.doc li { margin-bottom:.6rem; }
.doc a { color:var(--gold-deep); }
.doc-back { margin-top:2.6rem; }
.page-doc .site-header { background:var(--paper); border-bottom:1px solid var(--line); }

/* ============ scroll reveal ============ */
.has-js .reveal { opacity:0; transform:translateY(14px); transition:opacity .6s ease, transform .6s ease; }
.reveal.is-visible { opacity:1; transform:none; }

/* ============ responsive ============ */
@media (max-width:760px) {
  .menu-button { display:block; }
  .site-nav {
    position:fixed; inset:64px 0 auto 0; z-index:90;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--paper); border-bottom:1px solid var(--line);
    padding:.6rem clamp(20px,5vw,56px) 1.2rem;
    box-shadow:var(--shadow-md);
    transform:translateY(-12px); opacity:0; pointer-events:none;
    transition:opacity .2s, transform .2s;
  }
  .site-nav a { padding:.85rem 0; border-bottom:1px solid var(--line-soft); font-size:1rem; }
  .nav-donate { margin-top:.8rem; text-align:center; }
  html.nav-open .site-nav { transform:none; opacity:1; pointer-events:auto; }
}

@media (min-width:720px) {
  .two-fields { grid-template-columns:1fr 1fr; }
  .chizuk-list { grid-template-columns:1fr 1fr; }
}

@media (min-width:860px) {
  .meaning-grid { grid-template-columns:.9fr 1.1fr; gap:clamp(2.4rem,5vw,4.5rem); }
  .source-grid { grid-template-columns:1.05fr .95fr; }
  .source-section .source-grid { grid-template-columns:.95fr 1.05fr; }
  .mode-panel { grid-template-columns:1.05fr .95fr; }
  .tisha-grid { grid-template-columns:.85fr 1.15fr; gap:clamp(2.4rem,5vw,4.5rem); }
  .signup-band { grid-template-columns:.9fr 1.1fr; gap:2.4rem; }
  .participation-grid { grid-template-columns:repeat(3,1fr); }
  .faq-grid { grid-template-columns:.7fr 1.3fr; gap:clamp(2.4rem,5vw,4.5rem); }
  .footer-grid { grid-template-columns:1.4fr 1fr 1fr; }
}

@media (min-width:1100px) {
  .chizuk-list { grid-template-columns:repeat(3,1fr); }
}

/* ============ reduced motion ============ */
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { transition:none!important; animation:none!important; }
  .has-js .reveal { opacity:1; transform:none; }
  .button:hover, .choice:hover { transform:none; }
}
