/* Israel First — English campaign site.
   Palette is the flag: blue on white, nothing else. The one exception is the green
   used on seats 3 and 7, which marks Aleh Yarok's places on the joint list — that
   green carries information, so it stays.
   Recurring device: the flag's two horizontal bands, used under the masthead and
   as the divider between sections. */
:root{
  --blue:#0038b8;          /* the flag blue */
  --blue-deep:#00256f;     /* grounds: masthead, hero, closing panels */
  --blue-ink:#001a52;
  --blue-pale:#eef3fc;     /* tinted section ground */
  --blue-line:#cfdcf2;
  --white:#fff;
  --ink:#0a1729;           /* near-black, biased blue */
  --body:#33415a;
  --muted:#5f6f88;         /* grey, biased blue — not a neutral grey */
  --line:#d7e1f0;
  --donate:#ffd84a;        /* the campaign's own donate yellow — used only on the donate route */
  --green:#2f6b3f;         /* Aleh Yarok */
  --measure:38rem;
  --r:8px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--white);color:var(--ink);
  font:400 17px/1.65 ui-sans-serif,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
h1,h2,h3{font-family:ui-serif,Georgia,"Times New Roman",serif;font-weight:600;line-height:1.15;letter-spacing:-.012em;margin:0;text-wrap:balance}
h1{font-size:clamp(2.1rem,5.2vw,3.4rem)}
h2{font-size:clamp(1.5rem,3.2vw,2.1rem)}
h3{font-size:1.14rem;line-height:1.3}
p{margin:0 0 1rem}
a{color:var(--blue-deep)}
a:hover{color:var(--blue)}
img{max-width:100%;height:auto;display:block}
.wrap{width:min(68rem,100% - 2.5rem);margin-inline:auto}
.measure{max-width:var(--measure)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;background:#fff;padding:.6rem 1rem;z-index:99;border-radius:var(--r)}
:focus-visible{outline:2.5px solid var(--blue);outline-offset:2px}

/* masthead — the flag bands sit under it: blue, white, blue */
.site-head{
  background:var(--blue-deep);color:#fff;position:sticky;top:0;z-index:20;
  border-bottom:4px solid var(--blue);
  box-shadow:0 4px 0 var(--white),0 7px 0 var(--blue);
}
.head-inner{display:flex;align-items:center;gap:1rem;min-height:68px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.7rem;color:#fff;text-decoration:none;margin-inline-end:auto;padding:.6rem 0}
.brand-mark{
  font-family:ui-serif,Georgia,serif;font-size:1.05rem;line-height:1;
  border:1.5px solid rgba(255,255,255,.55);color:#fff;border-radius:5px;padding:.42rem .5rem;direction:rtl;
}
.brand-text strong{display:block;font-family:ui-serif,Georgia,serif;font-size:1.16rem;letter-spacing:-.01em}
.brand-text small{display:block;font-size:.72rem;color:#a8c0ea;letter-spacing:.06em;text-transform:uppercase}
.site-nav{display:flex;gap:.2rem;flex-wrap:wrap}
.site-nav a{color:#cfdcf5;text-decoration:none;font-size:.88rem;padding:.45rem .6rem;border-radius:5px}
.site-nav a:hover{background:rgba(255,255,255,.12);color:#fff}
.site-nav a[aria-current="page"]{color:#fff;box-shadow:inset 0 -2px 0 #fff}
.nav-toggle{display:none}

/* sections */
section{padding-block:3.4rem}
.sec-tight{padding-block:2.4rem}
.sec-blue{background:var(--blue-deep);color:#dbe6fa}
.sec-blue h2,.sec-blue h3{color:#fff}
.sec-blue a{color:#a8c0ea}
.sec-tint{background:var(--blue-pale);border-block:1px solid var(--blue-line)}
.kicker{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);font-weight:700;margin:0 0 .7rem}
.sec-blue .kicker{color:#8fb0e8}
.lead{font-size:1.14rem;color:var(--body)}
.sec-blue .lead{color:#c3d3ef}

/* hero */
.hero{background:linear-gradient(162deg,var(--blue-ink) 0%,var(--blue-deep) 48%,var(--blue) 100%);color:#fff;padding-block:4.2rem 3.6rem}
.hero h1{font-size:clamp(2.5rem,7vw,4.4rem)}
.hero .kicker{color:#9dbcf0}
.hero .he{direction:rtl;text-align:left;unicode-bidi:isolate;font-family:ui-serif,Georgia,serif;font-size:clamp(1.3rem,3.2vw,1.9rem);color:#bdd2f7;margin:.4rem 0 0}
.hero .lead{color:#d3e0f7;max-width:var(--measure);margin-block-start:1.4rem}
.hero-tag{display:inline-block;margin-block-start:1.6rem;font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:#a8c0ea;border-top:1px solid rgba(255,255,255,.3);padding-top:.8rem}

/* buttons */
.btn-row{display:flex;gap:.7rem;flex-wrap:wrap;margin-block-start:1.8rem}
.btn{display:inline-block;padding:.72rem 1.25rem;border-radius:var(--r);text-decoration:none;font-weight:600;font-size:.95rem;border:1.5px solid transparent}
.btn-primary{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn-primary:hover{background:var(--blue-deep);color:#fff}
.hero .btn-primary,.sec-blue .btn-primary{background:#fff;color:var(--blue-deep);border-color:#fff}
.hero .btn-primary:hover,.sec-blue .btn-primary:hover{background:#dce7fa;color:var(--blue-ink)}
.btn-ghost{border-color:var(--blue);color:var(--blue-deep)}
.btn-ghost:hover{background:var(--blue);color:#fff}
.hero .btn-ghost,.sec-blue .btn-ghost{border-color:rgba(255,255,255,.55);color:#fff}
.hero .btn-ghost:hover,.sec-blue .btn-ghost:hover{background:rgba(255,255,255,.14);color:#fff}

/* grids */
.grid{display:grid;gap:1.5rem}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(20rem,1fr))}
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:1.4rem 1.5rem}
.sec-tint .card{border-color:var(--blue-line)}
.sec-blue .card{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.2)}
.card h3{margin-block-end:.5rem;color:var(--blue-deep)}
.sec-blue .card h3{color:#fff}
.card p{color:var(--body)}
.sec-blue .card p{color:#c3d3ef}
.card p:last-child{margin-block-end:0}

/* platform planks — numbered because the list is ordered by priority, 01 first */
.planks{display:grid;gap:1.1rem;margin-block-start:2rem}
.plank{display:flex;gap:1.2rem;background:var(--white);border:1px solid var(--line);border-left:4px solid var(--blue);border-radius:var(--r);padding:1.3rem 1.5rem}
.plank-n{font-family:ui-serif,Georgia,serif;font-size:1.5rem;color:var(--blue);min-width:2.2rem;font-variant-numeric:tabular-nums}
.plank h3{margin-block-end:.4rem;color:var(--blue-deep)}
.plank p{margin:0;color:var(--body)}

/* candidates */
.cand-list{display:grid;gap:1.1rem;margin-block-start:2rem}
.cand{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:1.4rem 1.5rem}
.cand.is-pending{background:var(--blue-pale);border-style:dashed;border-color:var(--blue-line)}
.cand-top{display:flex;align-items:baseline;gap:.9rem;flex-wrap:wrap}
.cand-seat{
  font-family:ui-serif,Georgia,serif;font-size:.9rem;font-weight:600;color:#fff;background:var(--blue-deep);
  min-width:2.1rem;text-align:center;border-radius:5px;padding:.25rem .5rem;font-variant-numeric:tabular-nums
}
.cand.is-green .cand-seat{background:var(--green)}
.cand h3{margin:0}
.cand-he{direction:rtl;color:var(--muted);font-size:.95rem}
.cand-party{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.cand-role{color:var(--blue);font-weight:600;font-size:.92rem;margin:.45rem 0 .7rem}
.cand.is-green .cand-role{color:var(--green)}
.cand p{color:var(--body)}
.cand-pending{color:var(--muted);font-style:italic;margin:.6rem 0 0}
.cand-src{font-size:.78rem;color:var(--muted);margin:.9rem 0 0;padding-top:.7rem;border-top:1px solid var(--line)}

/* figure */
figure{margin:0}
figure img{border-radius:var(--r);border:1px solid var(--line)}
figcaption{font-size:.87rem;color:var(--muted);margin-block-start:.7rem}
.sec-blue figcaption{color:#a8c0ea}
.fig-split{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr));align-items:center}

/* prose blocks */
.blocks{display:grid;gap:1.7rem;margin-block-start:2rem;max-width:44rem}
.block h3{margin-block-end:.45rem;color:var(--blue-deep)}
.sec-blue .block h3{color:#fff}
.block p{margin:0;color:var(--body)}
.sec-blue .block p{color:#c3d3ef}

/* callout — the flag bands again, turned on their side */
.callout{
  background:var(--blue-pale);border:1px solid var(--blue-line);
  border-left:4px solid var(--blue);border-radius:var(--r);
  padding:1.2rem 1.4rem;margin-block-start:1.6rem;max-width:44rem
}
.callout h3{color:var(--blue-deep)}
.callout p{color:var(--body)}
.callout p:last-child{margin-block-end:0}
.sec-tint .callout{background:var(--white)}
.note{font-size:.85rem;color:var(--muted);margin-block-start:1.6rem;max-width:44rem}

/* footer */
.site-foot{background:var(--blue-deep);color:#b3c6e6;padding-block:2.8rem 2rem;font-size:.9rem;border-top:4px solid var(--blue)}
.site-foot a{color:#a8c0ea}
.foot-grid{display:grid;gap:1.6rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.foot-brand{font-family:ui-serif,Georgia,serif;font-size:1.2rem;color:#fff;margin:0}
.foot-he{direction:rtl;text-align:left;unicode-bidi:isolate;color:#bdd2f7;margin:.15rem 0 .4rem}
.foot-tag{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;margin:0}
.foot-note{font-size:.78rem;color:#7e93b8;margin:1.6rem 0 0;max-width:46rem}

@media (max-width:720px){
  .nav-toggle{
    display:block;background:transparent;border:1px solid rgba(255,255,255,.45);color:#fff;
    border-radius:5px;padding:.4rem .75rem;font:inherit;font-size:.85rem;cursor:pointer
  }
  .site-nav{display:none;width:100%;flex-direction:column;padding-block-end:.8rem}
  .site-nav.is-open{display:flex}
  .site-nav a{padding:.6rem .4rem}
}
@media print{.site-head,.site-foot,.btn-row{display:none}}

/* Hebrew eyebrow above the dvar Torah — RTL text, left-aligned in an LTR page */
.he-kicker{direction:rtl;text-align:left;unicode-bidi:isolate;font-size:.95rem;
  letter-spacing:0;text-transform:none;font-family:ui-serif,Georgia,serif}

/* ---- grid widths beyond the default two-up ---- */
.grid-3{grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(11rem,1fr))}

/* ---- statistics: the figure carries the weight, the label stays quiet ---- */
.stats{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));margin-block-start:1.4rem}
.stat{display:flex;flex-direction:column;gap:.35rem;padding-left:1.1rem;border-left:3px solid var(--blue)}
.sec-blue .stat{border-left-color:#5c8fe0}
.stat-fig{font-family:ui-serif,Georgia,serif;font-size:clamp(2rem,4.4vw,2.9rem);line-height:1;
  color:var(--blue-deep);font-variant-numeric:tabular-nums}
.sec-blue .stat-fig{color:#fff}
.stat-body{font-size:.95rem;color:var(--body)}
.sec-blue .stat-body{color:#c3d3ef}

.motto{font-family:ui-serif,Georgia,serif;font-size:clamp(1.5rem,3.6vw,2.2rem);line-height:1.2;
  color:#fff;margin:0;max-width:30rem;text-wrap:balance}

/* ---- portrait ---- */
.portrait{max-width:20rem;justify-self:end}
.portrait img{border-radius:var(--r);border:1px solid var(--line)}

/* ---- support page ---- */
.sec-donate{background:var(--blue-deep);color:#dbe6fa;
  border-block:4px solid var(--donate);padding-block:3.4rem}
.sec-donate h2,.sec-donate h3{color:#fff}
.sec-donate .lead{color:#c3d3ef}
.eyebrow{display:inline-block;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  background:var(--donate);color:#0d2352;border-radius:999px;padding:.3rem .8rem;margin:0 0 .9rem}
.sec-tint .eyebrow{background:var(--blue);color:#fff}

.bank{background:#fff;color:var(--ink);border-radius:var(--r);padding:1.5rem 1.6rem;margin-block-start:1.8rem;
  border-top:6px solid var(--donate);max-width:46rem}
.bank-title{font-family:ui-serif,Georgia,serif;font-size:1.25rem;color:var(--blue-deep);margin:0}
.bank-intro{font-size:.92rem;color:var(--body);margin:.4rem 0 1.2rem}
.bank-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));
  border-block:1px solid var(--line);padding-block:1.1rem}
.bank-cell{display:flex;flex-direction:column;gap:.2rem}
.bank-label{font-size:.7rem;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);font-weight:600}
.bank-value{font-size:1rem;color:var(--blue-deep);font-weight:600}
.bank-value.is-big{font-family:ui-serif,Georgia,serif;font-size:1.5rem;font-variant-numeric:tabular-nums;
  letter-spacing:.01em;overflow-wrap:anywhere}
.bank-cap{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  margin:1.1rem 0 0;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.bank-cap strong{font-family:ui-serif,Georgia,serif;font-size:1.5rem;letter-spacing:0;text-transform:none;
  color:var(--blue-deep);font-variant-numeric:tabular-nums}
.bank-foreign{margin:1.1rem 0 0;padding-top:1rem;border-top:1px solid var(--line);
  font-size:.9rem;color:var(--body)}

.rules{margin:1.8rem 0 0;padding:0;list-style:none;display:grid;gap:.7rem;max-width:44rem}
.rules li{position:relative;padding-left:1.4rem;font-size:.95rem}
.rules li::before{content:"";position:absolute;left:0;top:.62em;width:.5rem;height:.5rem;
  border-radius:50%;background:var(--blue)}
.sec-donate .rules li::before{background:var(--donate)}
.sec-donate .rules li{color:#c3d3ef}

.tier-amount{font-family:ui-serif,Georgia,serif;font-size:1.25rem;color:var(--blue);margin:.2rem 0 .6rem}

/* ---- downloadable banners ---- */
.banners{margin-block-start:1.8rem}
.banner{display:flex;flex-direction:column;gap:.55rem}
.banner-img{display:block;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);
  background:var(--blue-pale)}
.banner-img img{aspect-ratio:4/5;object-fit:cover;width:100%;transition:transform .25s ease}
.banner-img:hover img{transform:scale(1.02)}
.banner h3{font-size:1.02rem;margin:0}
.banner p{font-size:.88rem;color:var(--muted);margin:0}
.btn-sm{padding:.45rem .9rem;font-size:.85rem;align-self:start}
@media (prefers-reduced-motion:reduce){.banner-img img{transition:none}.banner-img:hover img{transform:none}}

/* ---- ask / propose form ---- */
.ask{max-width:40rem;margin-block-start:1.8rem;display:grid;gap:1rem}
.ask-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr))}
.ask-row{display:flex;flex-direction:column;gap:.35rem}
.ask label{font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;font-weight:600;color:#a8c0ea}
.ask input,.ask select,.ask textarea{
  font:inherit;font-size:.98rem;color:var(--ink);background:#fff;
  border:1px solid var(--blue-line);border-radius:var(--r);padding:.6rem .75rem;width:100%
}
.ask textarea{resize:vertical;min-height:7rem}
.ask-hp{position:absolute;left:-9999px}
.ask-privacy{font-size:.83rem;color:#8aa4cf;margin:0;max-width:34rem}

/* ---- pledge form additions ---- */
.hint{font-size:.8rem;color:#8aa4cf;text-transform:none;letter-spacing:0;font-weight:400}
.sec-tint .hint,.sec-tight .hint{color:var(--muted)}
.check{display:flex;gap:.7rem;align-items:flex-start;font-size:.95rem;color:#dbe6fa;
  text-transform:none;letter-spacing:0;font-weight:400;line-height:1.45}
.check input{width:1.15rem;height:1.15rem;margin-top:.15rem;flex:none;accent-color:var(--blue)}
.pledge-form{max-width:42rem}

/* ---- launch markers ----
   A marker is an admission, not a warning label, so it sits in the reading flow at
   body size rather than shouting from a coloured box. Amber separates it from the
   blue of the site's own voice: this is the site talking about itself. */
.markers{display:grid;gap:.6rem;margin-block-start:1.4rem;max-width:44rem}
.marker{
  margin:0;font-size:.9rem;line-height:1.5;color:#6b5418;
  background:#fdf7e6;border:1px solid #ecd9a4;border-left:3px solid #d9a521;
  border-radius:var(--r);padding:.75rem .95rem
}
.marker a{color:#8a6a14;text-decoration:underline;text-underline-offset:2px}
.marker a:hover{color:#5f4a0f}
.marker-tag{
  display:inline-block;font-size:.66rem;letter-spacing:.11em;text-transform:uppercase;
  font-weight:700;background:#d9a521;color:#2c2205;border-radius:3px;
  padding:.13rem .42rem;margin-inline-end:.5rem;vertical-align:.09em
}
.sec-blue .marker,.sec-donate .marker{background:rgba(255,255,255,.08);border-color:rgba(236,217,164,.35);
  border-left-color:#e8bf52;color:#f2e2bb}
.sec-blue .marker a,.sec-donate .marker a{color:#f6d98c}

/* ---- status page ---- */
.checks{margin-block-start:2rem;max-width:46rem}
.check{padding:1.2rem 0;border-top:1px solid var(--line)}
.check-head{display:flex;align-items:baseline;gap:.75rem}
.check-dot{width:.6rem;height:.6rem;border-radius:50%;background:#d9a521;flex:none;transform:translateY(-.1em)}
.check.is-done .check-dot{background:var(--green)}
.check.is-done h3{color:var(--muted);text-decoration:line-through;text-decoration-thickness:1px}
.check h3{margin:0;font-size:1.05rem}
.check-meta{display:grid;grid-template-columns:auto 1fr;gap:.3rem 1rem;margin:.8rem 0 0;
  padding-left:1.35rem;font-size:.9rem}
.check-meta dt{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  font-weight:600;padding-top:.28em}
.check-meta dd{margin:0;color:var(--body)}
@media (max-width:540px){
  .check-meta{grid-template-columns:1fr;gap:.15rem}
  .check-meta dt{padding-top:.5rem}
}