/* eladrefoua.com design system - "Open Field" (2026-10-05).
   Bright and inviting; expansion, curiosity, knowledge. Colours borrowed from the film
   "Let AI be AI": teal = what learns, amber = the human line. Documented in site/DESIGN.md.
   This file is the single stylesheet for every generated page; page-specific rules live in
   assets/pages/<page>.css. */

:root{
  /* ground */
  --bg:#FBFAF7; --bg-2:#F4F7F6; --surface:#FFFFFF; --surface-2:#F8FAF9;
  /* ink */
  --ink:#10242A; --ink-2:#3B5157; --ink-3:#5E7378;
  /* teal: what learns */
  --teal:#0A7369; --teal-2:#14A396; --teal-3:#2EC4B6; --teal-wash:#E8F6F3; --teal-wash-2:#D3EFEA;
  /* amber: the human line */
  --amber:#F2B544; --amber-2:#F7CB72; --amber-deep:#B86E00; --amber-ink:#8A5300; --amber-wash:#FFF4DE;
  /* --amber is for fills only (1.9:1 on white); --amber-deep is the lightest amber for large text (4:1) */
  --rose:#C2410C;
  /* lines and depth */
  --line:rgba(16,36,42,.10); --line-2:rgba(16,36,42,.16);
  --shadow-1:0 1px 2px rgba(16,36,42,.05);
  --shadow-2:0 1px 2px rgba(16,36,42,.04), 0 12px 32px -14px rgba(16,36,42,.18);
  --shadow-3:0 2px 4px rgba(16,36,42,.05), 0 24px 56px -22px rgba(16,36,42,.28);
  --radius:18px; --radius-sm:12px; --radius-lg:28px;
  /* type */
  --f-display:'Secular One','Heebo',system-ui,sans-serif;
  --f-body:'Heebo','Assistant',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-serif:'Frank Ruhl Libre','Crimson Pro',Georgia,serif;
  --f-latin-serif:'Crimson Pro','Frank Ruhl Libre',Georgia,serif;
  --f-mono:'IBM Plex Mono','Heebo',ui-monospace,'Cascadia Mono',Consolas,monospace;
  /* layout */
  --container:1180px; --container-narrow:760px; --gutter:clamp(16px,4vw,40px);
  --nav-h:64px;
  --ease:cubic-bezier(.2,.8,.2,1);
  --z-nav:30; --z-overlay:50;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-h) + 28px);}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--f-body); font-size:17px; font-weight:400; line-height:1.7;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility; min-height:100vh; display:flex; flex-direction:column;
  overflow-x:clip;
}
@media (max-width:600px){ body{font-size:16px;} }
img,video,svg,canvas{display:block; max-width:100%;}
img{height:auto;}
a{color:inherit; text-decoration:none;}
p a, .prose a, li a.inline{color:var(--teal); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; text-decoration-color:color-mix(in srgb,var(--teal) 45%,transparent); transition:color .2s ease, text-decoration-color .2s ease;}
p a:hover, .prose a:hover, li a.inline:hover{color:var(--amber-ink); text-decoration-color:currentColor;}
button{font:inherit; color:inherit;}
::selection{background:var(--amber-2); color:var(--ink);}
:focus-visible{outline:3px solid var(--teal); outline-offset:3px; border-radius:6px;}
.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;}
[hidden]{display:none!important;}

/* Latin runs inside Hebrew (and code) keep their own direction */
.ltr, code, kbd, .latin{direction:ltr; unicode-bidi:isolate;}
.num, time{unicode-bidi:isolate;}

/* ------------------------------------------------------------------ layout */
.container{width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter);}
.container.narrow{max-width:var(--container-narrow);}
main{flex:1 0 auto; position:relative;}
.section{padding-block:clamp(56px,9vw,112px); position:relative;}
.section.tight{padding-block:clamp(36px,6vw,64px);}
.section.wash{background:linear-gradient(180deg,var(--bg-2),var(--bg));}
.stack > * + *{margin-block-start:var(--stack,1rem);}
.grid{display:grid; gap:clamp(16px,2.4vw,28px);}
.grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:980px){ .grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr));} .grid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:640px){ .grid.cols-2,.grid.cols-3,.grid.cols-4{grid-template-columns:minmax(0,1fr);} }

/* ------------------------------------------------------------------ type */
h1,h2,h3,h4{margin:0; color:var(--ink); font-weight:400; line-height:1.15; text-wrap:balance;}
.display{font-family:var(--f-display); font-size:clamp(48px,8.4vw,104px); line-height:.98; letter-spacing:-.01em;}
.h1{font-family:var(--f-display); font-size:clamp(38px,5.6vw,68px); line-height:1.04;}
.h2{font-family:var(--f-display); font-size:clamp(28px,3.6vw,44px); line-height:1.1;}
.h3{font-family:var(--f-body); font-weight:700; font-size:clamp(19px,1.9vw,23px); line-height:1.3;}
.serif{font-family:var(--f-serif);}
.lede{font-size:clamp(18px,2vw,22px); line-height:1.6; color:var(--ink-2); max-inline-size:52ch; text-wrap:pretty;}
.muted{color:var(--ink-3);}
.small{font-size:14px; line-height:1.6;}
p{margin:0; text-wrap:pretty;}
.eyebrow{display:inline-flex; align-items:center; gap:.6em; font-family:var(--f-mono); font-size:13px; font-weight:500; letter-spacing:.06em; color:var(--teal); text-transform:uppercase;}
html[lang="he"] .eyebrow, html[lang="he"] .site-footer h2{letter-spacing:.01em; font-size:14px; font-weight:600;}
.eyebrow .dot{inline-size:8px; block-size:8px; border-radius:50%; background:var(--teal-3); box-shadow:0 0 0 4px var(--teal-wash);}
.eyebrow.amber{color:var(--amber-ink);} .eyebrow.amber .dot{background:var(--amber); box-shadow:0 0 0 4px var(--amber-wash);}
.index-num{font-family:var(--f-mono); font-size:13px; font-weight:500; color:var(--ink-3); letter-spacing:.04em;}
.prose{max-inline-size:68ch;}
.prose > * + *{margin-block-start:1em;}
.prose h2{font-family:var(--f-display); font-size:clamp(24px,2.6vw,32px); margin-block-start:1.8em;}
.prose h3{font-weight:700; font-size:19px; margin-block-start:1.5em;}
.prose ul,.prose ol{padding-inline-start:1.3em; margin:0;}
.prose li + li{margin-block-start:.4em;}
.prose li::marker{color:var(--teal-2);}

/* the human line: a hand-drawn amber stroke under a title */
.hand-line{display:block; inline-size:min(260px,60%); block-size:18px; margin-block:.3em .2em; overflow:visible;}
.hand-line path{fill:none; stroke:var(--amber); stroke-width:5; stroke-linecap:round; stroke-dasharray:420; stroke-dashoffset:420; animation:draw-line 1.4s .35s var(--ease) forwards;}
@keyframes draw-line{to{stroke-dashoffset:0;}}
@media (prefers-reduced-motion:reduce){ .hand-line path{animation:none; stroke-dashoffset:0;} }

/* ------------------------------------------------------------------ nav (floating) */
.skip-link{position:absolute; inset-inline-start:12px; top:-80px; z-index:calc(var(--z-overlay) + 1); background:var(--ink); color:#fff; padding:12px 18px; border-radius:10px; font-size:15px; transition:top .2s var(--ease);}
.skip-link:focus{top:12px;}
.site-nav{position:sticky; top:12px; z-index:var(--z-nav); margin:12px var(--gutter) 0; }
.site-nav .bar{max-width:calc(var(--container) - 2 * var(--gutter)); margin-inline:auto; min-block-size:var(--nav-h);
  display:flex; align-items:center; gap:12px; padding:8px 10px 8px 14px;
  background:rgba(255,255,255,.86); backdrop-filter:saturate(1.4) blur(14px); -webkit-backdrop-filter:saturate(1.4) blur(14px);
  border:1px solid var(--line); border-radius:999px; box-shadow:var(--shadow-2);}
html[dir="rtl"] .site-nav .bar{padding:8px 14px 8px 10px;}
.brand{display:inline-flex; align-items:center; gap:10px; min-block-size:44px; padding-inline:4px; font-family:var(--f-display); font-size:19px; color:var(--ink); white-space:nowrap;}
.brand-mark{inline-size:34px; block-size:34px; flex:0 0 auto;}
.nav-links{display:flex; align-items:center; gap:2px; margin-inline-start:auto; list-style:none; padding:0; margin-block:0;}
.nav-links a{display:inline-flex; align-items:center; min-block-size:44px; padding-inline:14px; border-radius:999px; font-size:15.5px; font-weight:500; color:var(--ink-2); transition:background .2s ease, color .2s ease;}
.nav-links a:hover{background:var(--teal-wash); color:var(--ink);}
.nav-links a[aria-current="page"]{background:var(--ink); color:#fff;}
.nav-tools{display:flex; align-items:center; gap:6px;}
.lang-toggle{display:inline-flex; align-items:center; border:1px solid var(--line-2); border-radius:999px; padding:3px;}
.lang-toggle button{appearance:none; border:0; background:none; cursor:pointer; min-block-size:36px; min-inline-size:40px; padding-inline:10px; border-radius:999px; font-family:var(--f-mono); font-size:12.5px; font-weight:500; letter-spacing:.04em; color:var(--ink-3); transition:background .2s ease,color .2s ease;}
.lang-toggle button.active{background:var(--teal-wash-2); color:var(--ink);}
.menu-btn{display:none; appearance:none; border:1px solid var(--line-2); background:var(--surface); border-radius:999px; min-block-size:44px; min-inline-size:44px; cursor:pointer; align-items:center; justify-content:center;}
.menu-btn svg{inline-size:20px; block-size:20px;}
/* contact, prominent at the top of every page */
.btn-sm{min-block-size:40px; padding:.45em 1.05em; font-size:15px;}
.contact-cta{position:relative;}
.contact-btn svg{inline-size:18px; block-size:18px;}
.contact-panel{position:absolute; inset-block-start:calc(100% + 12px); inset-inline-end:0; z-index:var(--z-overlay); min-inline-size:270px;
  display:grid; gap:2px; padding:8px; background:var(--surface); border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow-3);}
.contact-panel a{display:flex; align-items:center; gap:12px; min-block-size:48px; padding:8px 14px; border-radius:12px; font-weight:500; color:var(--ink); transition:background .2s ease, color .2s ease;}
.contact-panel a:hover{background:var(--teal-wash); color:var(--teal);}
.contact-panel svg{inline-size:20px; block-size:20px; flex:0 0 auto; color:var(--teal);}
@media (max-width:600px){
  .site-nav .bar, html[dir="rtl"] .site-nav .bar{gap:8px;}
  .brand{font-size:17px; gap:8px;}
  .nav-tools{gap:6px;}
  .lang-toggle button{min-inline-size:34px; padding-inline:6px;}
  .contact-btn{min-inline-size:44px; min-block-size:44px; padding:0; justify-content:center;}
  .contact-btn .contact-label{position:absolute; inline-size:1px; block-size:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}
  .contact-panel{position:fixed; inset-block-start:calc(var(--nav-h) + 28px); inset-inline:12px; min-inline-size:0;}
}
@media (max-width:360px){
  .brand > span{position:absolute; inline-size:1px; block-size:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}
}
@media (max-width:380px){
  .site-nav{margin-inline:10px;}
  .site-nav .bar, html[dir="rtl"] .site-nav .bar{padding:6px 8px; gap:6px;}
  .brand{font-size:16px; gap:7px;} .brand-mark{inline-size:30px; block-size:30px;}
  .lang-toggle button{min-inline-size:34px; padding-inline:6px;}
}
@media (max-width:900px){
  .menu-btn{display:inline-flex;}
  .nav-links{position:absolute; inset-inline:0; top:calc(100% + 8px); flex-direction:column; align-items:stretch; gap:2px; padding:10px;
    background:rgba(255,255,255,.97); border:1px solid var(--line); border-radius:22px; box-shadow:var(--shadow-3); display:none;}
  .site-nav.open .nav-links{display:flex;}
  .nav-links a{min-block-size:48px; font-size:17px; padding-inline:16px;}
  .nav-tools{margin-inline-start:auto;}
}

/* ------------------------------------------------------------------ buttons, chips */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:.55em; min-block-size:48px; padding:.7em 1.35em; border-radius:999px; border:1px solid transparent;
  font-family:var(--f-body); font-size:16px; font-weight:600; line-height:1.2; white-space:nowrap; cursor:pointer;
  transition:background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s var(--ease);}
.btn svg{inline-size:18px; block-size:18px; flex:0 0 auto;}
.btn-primary{background:var(--amber); color:var(--ink); box-shadow:0 1px 0 rgba(16,36,42,.08), 0 8px 20px -10px rgba(138,83,0,.55);}
.btn-primary:hover{background:var(--amber-2); transform:translateY(-1px);}
.btn-ink{background:var(--ink); color:#fff;}
.btn-ink:hover{background:#1d3a42;}
.btn-ghost{background:var(--surface); color:var(--ink); border-color:var(--line-2);}
.btn-ghost:hover{border-color:var(--teal-2); color:var(--teal);}
.arr{display:inline-block; transition:transform .2s var(--ease);}
html[dir="ltr"] .arr{transform:scaleX(-1);}
a:hover .arr{transform:translateX(-3px);}
html[dir="ltr"] a:hover .arr{transform:scaleX(-1) translateX(-3px);}
.chip{display:inline-flex; align-items:center; gap:.45em; min-block-size:32px; padding:.2em .85em; border-radius:999px; background:var(--surface); border:1px solid var(--line); font-size:14px; color:var(--ink-2);}
.chip.teal{background:var(--teal-wash); border-color:transparent; color:var(--teal);}
.chip.amber{background:var(--amber-wash); border-color:transparent; color:var(--amber-ink);}
.pill-links{display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0;}
.pill-links a{display:inline-flex; align-items:center; min-block-size:44px; padding-inline:16px; border-radius:999px; background:var(--surface); border:1px solid var(--line); font-size:14.5px; color:var(--ink-2); transition:border-color .2s ease,color .2s ease,background .2s ease;}
.pill-links a:hover{border-color:var(--teal-2); color:var(--teal); background:var(--teal-wash);}

/* ------------------------------------------------------------------ cards */
.card{position:relative; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:clamp(20px,2.6vw,30px); box-shadow:var(--shadow-1);}
a.card, .card.link{display:block; cursor:pointer; transition:box-shadow .25s ease, border-color .25s ease, transform .25s var(--ease);}
a.card:hover, .card.link:hover{box-shadow:var(--shadow-3); border-color:color-mix(in srgb,var(--teal-2) 40%,transparent); transform:translateY(-2px);}
.card.soft{background:var(--surface-2); box-shadow:none;}
.card.teal{background:var(--teal-wash); border-color:transparent; box-shadow:none;}
.card.amber{background:var(--amber-wash); border-color:transparent; box-shadow:none;}

/* ------------------------------------------------------------------ page header (subpages) */
.page-head{position:relative; overflow:hidden; padding-block:clamp(56px,9vw,120px) clamp(36px,6vw,72px);}
.page-head .field{position:absolute; inset:0; inline-size:100%; block-size:100%; z-index:0; pointer-events:none;}
.page-head::before{content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(60% 80% at 15% 0%, var(--teal-wash) 0%, transparent 60%), radial-gradient(50% 70% at 95% 10%, var(--amber-wash) 0%, transparent 55%);}
.page-head .container{position:relative; z-index:1;}
.page-head .h1{margin-block-start:.35em;}
.page-head.compact{padding-block:clamp(32px,4.5vw,60px) clamp(16px,2.4vw,28px);}
.film-main{padding-block-end:clamp(40px,6vw,72px);}
.film-blurb{margin-block-start:1.4em; max-inline-size:62ch;}
.page-head .lede{margin-block-start:1em;}

/* ------------------------------------------------------------------ hero (home) */
.hero{position:relative; overflow:hidden; padding-block:clamp(40px,7vw,96px) clamp(48px,8vw,104px); isolation:isolate;}
.hero::before{content:""; position:absolute; inset:-10% -10% 0; z-index:-2; pointer-events:none;
  background:radial-gradient(42% 60% at 20% 30%, var(--teal-wash) 0%, transparent 70%), radial-gradient(38% 50% at 85% 10%, var(--amber-wash) 0%, transparent 65%), radial-gradient(60% 50% at 50% 100%, #F1F7F5 0%, transparent 70%);}
.hero .field{position:absolute; inset:0; inline-size:100%; block-size:100%; z-index:-1;}
.hero-grid{display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:clamp(24px,5vw,72px); align-items:center;}
.hero-portrait{position:relative; margin:0; justify-self:center; inline-size:min(100%,380px);}
.hero-portrait .halo{position:absolute; inset:8% 6% 0; border-radius:50% 50% 46% 46%; background:radial-gradient(circle at 50% 42%, #fff 0%, var(--teal-wash) 48%, rgba(232,246,243,0) 72%); z-index:-1;}
.hero-portrait img{position:relative; inline-size:100%;
  -webkit-mask-image:linear-gradient(to bottom,#000 72%,transparent 100%), linear-gradient(to right,transparent 0,#000 12%,#000 88%,transparent 100%);
  -webkit-mask-composite:source-in; mask-image:linear-gradient(to bottom,#000 72%,transparent 100%), linear-gradient(to right,transparent 0,#000 12%,#000 88%,transparent 100%); mask-composite:intersect;}
.hero .display{margin-block-start:.28em;}
.hero .lede{margin-block-start:.9em;}
.hero .prize{display:inline-flex; align-items:center; gap:.6em; margin-block-start:1.2em; padding:.45em 1em .45em .9em; border-radius:999px; background:var(--amber-wash); color:var(--amber-ink); font-weight:600; font-size:15.5px; line-height:1.4;}
.hero .prize svg{inline-size:18px; block-size:18px; flex:0 0 auto;}
.hero .meta{margin-block-start:.9em; color:var(--ink-3); font-size:15px; line-height:1.6; max-inline-size:60ch;}
.hero .meta + .meta{margin-block-start:.35em;}
.cta-row{display:flex; flex-wrap:wrap; gap:12px; margin-block-start:1.8em;}
@media (max-width:860px){
  .hero-grid{grid-template-columns:minmax(0,1fr);}
  .hero-portrait{order:-1; inline-size:min(62vw,260px); justify-self:start;}
}

/* ------------------------------------------------------------------ open question (curiosity) */
.question-card{display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(14px,2.4vw,28px); align-items:start; max-inline-size:880px; margin-inline:auto;
  padding:clamp(18px,2.6vw,28px) clamp(20px,3vw,34px); border-radius:var(--radius-lg); background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-2);}
.question-card .q-foot{display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-block-start:14px;}
.question-card .q-foot .q-dots{margin:0;}
.question-card .q-mark{font-family:var(--f-display); font-size:clamp(44px,6vw,64px); line-height:1; color:var(--amber);}
.question-card .q-text{font-family:var(--f-serif); font-size:clamp(19px,2.3vw,26px); line-height:1.45; color:var(--ink); min-block-size:2.9em; display:flex; align-items:center; transition:opacity .35s ease;}
.question-card .q-text.fading{opacity:0;}
.question-card .q-dots{display:flex; gap:6px; margin-block-start:8px;}
.question-card .q-dots button{inline-size:24px; block-size:24px; border:0; padding:0; background:none; cursor:pointer; display:grid; place-items:center;}
.question-card .q-dots button::before{content:""; inline-size:7px; block-size:7px; border-radius:50%; background:var(--line-2); transition:background .2s ease, transform .2s ease;}
.question-card .q-dots button[aria-current="true"]::before{background:var(--teal-2); transform:scale(1.25);}
/* home rhythm: no dead bands between the film, the question and the doors */
.page-home .section{padding-block:clamp(44px,6vw,88px);}
.page-home .section.tight{padding-block:clamp(8px,2vw,24px);}
.page-home .film-section{padding-block-end:clamp(24px,3vw,40px);}
/* phone hero: the call to action rises to the first screen, the credentials follow it */
@media (max-width:520px){
  .hero-text{display:flex; flex-direction:column;}
  .hero-text > *{order:6;}
  .hero-text > .eyebrow{order:1;} .hero-text > .display{order:2;} .hero-text > .hand-line{order:3;}
  .hero-text > .lede{order:4;} .hero-text > .cta-row{order:5; margin-block-start:1.2em;}
  .hero-text > .prize{align-self:flex-start;}
  .hero-portrait{inline-size:min(44vw,180px);}
}

/* ------------------------------------------------------------------ film */
.film-band{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(24px,4.5vw,64px); align-items:center;}
@media (max-width:900px){ .film-band{grid-template-columns:minmax(0,1fr);} }
.film-frame{position:relative; display:block; aspect-ratio:16/9; border-radius:var(--radius-lg); overflow:hidden; background:#0B1418; box-shadow:var(--shadow-3); isolation:isolate;}
.film-frame img, .film-frame video{position:absolute; inset:0; inline-size:100%; block-size:100%; object-fit:cover;}
.film-frame .play{position:absolute; inset:0; margin:auto; inline-size:72px; block-size:72px; border-radius:50%; display:grid; place-items:center; background:var(--amber); color:var(--ink); box-shadow:0 10px 30px -6px rgba(0,0,0,.45); transition:transform .25s var(--ease), background .2s ease; z-index:2;}
.film-frame .play svg{inline-size:30px; block-size:30px; margin-inline-start:4px;}
/* the play triangle points right in both languages: a media convention, not a reading direction */
html[dir="rtl"] .film-frame .play svg{margin-inline-start:0; margin-inline-end:4px;}
a.film-frame:hover .play{transform:scale(1.06); background:var(--amber-2);}
.film-frame .badge{position:absolute; inset-block-end:14px; inset-inline-start:14px; z-index:2; display:inline-flex; gap:.5em; align-items:center; padding:.3em .8em; border-radius:999px; background:rgba(11,20,24,.62); color:#EAE6DE; font-family:var(--f-mono); font-size:12.5px; letter-spacing:.04em; backdrop-filter:blur(6px);}
.film-meta{display:flex; flex-wrap:wrap; gap:8px; margin-block-start:1.1em;}
.player{border-radius:var(--radius-lg); overflow:hidden; background:#0B1418; box-shadow:var(--shadow-3);}
.player video{inline-size:100%; block-size:auto; aspect-ratio:16/9; background:#0B1418;}
.film-layout{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:clamp(20px,3vw,36px); align-items:start;}
@media (max-width:980px){ .film-layout{grid-template-columns:minmax(0,1fr);} }
.chapters{list-style:none; margin:0; padding:0; display:grid; gap:6px;}
.chapters button{appearance:none; inline-size:100%; display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; align-items:center; text-align:start; min-block-size:48px; padding:8px 14px; border-radius:14px; border:1px solid var(--line); background:var(--surface); cursor:pointer; transition:border-color .2s ease, background .2s ease;}
.chapters button:hover{border-color:var(--teal-2); background:var(--teal-wash);}
.chapters button[aria-current="true"]{border-color:var(--teal-2); background:var(--teal-wash); box-shadow:inset 3px 0 0 var(--teal-2);}
html[dir="rtl"] .chapters button[aria-current="true"]{box-shadow:inset -3px 0 0 var(--teal-2);}
.chapters .t{font-family:var(--f-mono); font-size:13px; color:var(--teal); direction:ltr; unicode-bidi:isolate;}
.chapters .n{font-weight:500; font-size:15.5px; color:var(--ink);}
.question-list{list-style:none; margin:0; padding:0; display:grid; gap:10px; counter-reset:q;}
.question-list li{counter-increment:q;}
.question-list button{appearance:none; inline-size:100%; text-align:start; display:grid; grid-template-columns:auto minmax(0,1fr); gap:14px; align-items:baseline; padding:14px 18px; border-radius:16px; border:1px solid var(--line); background:var(--surface); cursor:pointer; font-family:var(--f-serif); font-size:clamp(17px,1.9vw,20px); line-height:1.5; color:var(--ink); transition:border-color .2s ease, background .2s ease;}
.question-list button::before{content:counter(q, decimal-leading-zero); font-family:var(--f-mono); font-size:13px; color:var(--amber-ink);}
.question-list button:hover{border-color:var(--amber); background:var(--amber-wash);}
.credits{list-style:none; margin:0; padding:0; display:grid; gap:6px; color:var(--ink-3); font-size:14.5px;}

/* ------------------------------------------------------------------ doors (home destinations) */
.doors{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(16px,2.4vw,28px);}
@media (max-width:720px){ .doors{grid-template-columns:minmax(0,1fr);} }
.door{position:relative; display:grid; grid-template-columns:minmax(0,1fr) clamp(110px,34%,190px); grid-template-rows:auto 1fr auto; column-gap:clamp(12px,2vw,24px); row-gap:14px;
  min-block-size:260px; padding:clamp(22px,3vw,34px); border-radius:var(--radius-lg); background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-1); overflow:hidden; cursor:pointer; isolation:isolate;
  transition:box-shadow .3s ease, border-color .3s ease, transform .3s var(--ease);}
.door > :not(.motif){grid-column:1;}
.door:hover{box-shadow:var(--shadow-3); border-color:color-mix(in srgb,var(--teal-2) 35%,transparent); transform:translateY(-3px);}
.door .motif{grid-column:2; grid-row:1 / -1; align-self:center; inline-size:100%; block-size:auto; aspect-ratio:1; pointer-events:none;}
@media (max-width:520px){
  .door{grid-template-columns:minmax(0,1fr);}
  .door .motif{grid-column:1; grid-row:auto; order:-1; inline-size:96px; justify-self:end; margin-block-end:-60px;}
}
.door .motif circle{transition:transform .6s var(--ease), opacity .4s ease; transform-box:fill-box; transform-origin:center;}
.door:hover .motif .grow{transform:scale(1.35);}
.door:hover .motif .drift{transform:translate(var(--dx,0px),var(--dy,0px));}
.door h2{font-family:var(--f-display); font-size:clamp(28px,3.2vw,40px); line-height:1.08; margin-block-start:.2em;}
.door p{color:var(--ink-2); max-inline-size:40ch;}
.door .door-foot{display:flex; align-items:center; justify-content:space-between; gap:12px;}
.door .go{display:inline-flex; align-items:center; gap:.5em; font-weight:600; color:var(--teal);}
.door.quiet h2{color:var(--ink-2);}
.door.quiet .go{color:var(--ink-3);}

/* ------------------------------------------------------------------ about */
.about{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(24px,5vw,72px); align-items:start;}
@media (max-width:860px){ .about{grid-template-columns:minmax(0,1fr);} }
.about .bio-text{font-family:var(--f-serif); font-size:clamp(18px,1.9vw,21px); line-height:1.85; color:var(--ink-2);}

/* ------------------------------------------------------------------ footer */
.site-footer{margin-block-start:auto; padding-block:clamp(40px,6vw,64px) 36px; background:var(--surface); border-block-start:1px solid var(--line);}
.footer-grid{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr); gap:28px;}
@media (max-width:800px){ .footer-grid{grid-template-columns:minmax(0,1fr);} }
.site-footer h2{font-family:var(--f-mono); font-size:12.5px; font-weight:500; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); margin-block-end:.8em;}
.site-footer ul{list-style:none; margin:0; padding:0; display:grid; gap:2px;}
.site-footer a{display:inline-flex; align-items:center; min-block-size:40px; color:var(--ink-2); transition:color .2s ease;}
.site-footer a:hover{color:var(--teal);}
.footer-brand{font-family:var(--f-display); font-size:24px;}
.footer-note{margin-block-start:28px; padding-block-start:18px; border-block-start:1px solid var(--line); display:flex; flex-wrap:wrap; gap:8px 18px; justify-content:space-between; color:var(--ink-3); font-size:13.5px;}
.footer-note .updated{font-family:var(--f-mono); font-size:12.5px;}

/* ------------------------------------------------------------------ tables */
.table-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--surface);}
table{border-collapse:collapse; inline-size:100%; font-size:15px;}
th,td{padding:12px 16px; text-align:start; vertical-align:top; border-block-end:1px solid var(--line);}
th{font-weight:600; background:var(--surface-2); color:var(--ink);}
tr:last-child td{border-block-end:0;}

/* ------------------------------------------------------------------ forms */
label{font-weight:500;}
input,select,textarea{font:inherit; color:var(--ink); background:var(--surface); border:1px solid var(--line-2); border-radius:12px; padding:.7em .9em; min-block-size:48px; inline-size:100%; transition:border-color .2s ease, box-shadow .2s ease;}
input:focus,select:focus,textarea:focus{outline:none; border-color:var(--teal-2); box-shadow:0 0 0 4px var(--teal-wash);}

/* ------------------------------------------------------------------ reveal on scroll (once, subtle) */
.js .reveal{opacity:0; transform:translateY(14px); transition:opacity .6s var(--ease), transform .6s var(--ease);}
.js .reveal.in{opacity:1; transform:none;}
@media (prefers-reduced-motion:reduce){ .js .reveal{opacity:1; transform:none; transition:none;} *{animation-duration:.001ms!important; transition-duration:.001ms!important;} }

/* ------------------------------------------------------------------ bilingual blocks */
html[lang="he"] [data-lang-block="en"], html[lang="en"] [data-lang-block="he"]{display:none!important;}

/* ------------------------------------------------------------------ print */
@media print{ .site-nav,.field,.menu-btn,.lang-toggle,.film-frame .play{display:none!important;} body{background:#fff;} .card,.door{box-shadow:none;} }
