.menorah-landing{
  --canvas:#F4EFFC;
  --canvas-2:#EAE0F9;
  --deep:#1C1140;
  --deep-2:#2B1854;
  --purple:#5B2A9E;
  --purple-strong:#4A1F86;
  --gold:#D9A94C;
  --gold-soft:#F2DDA6;
  --pink:#D1478E;
  --ink:#241539;
  --ink-muted:#6B5C8A;
  --line:rgba(36,21,57,0.10);
  font-family:'Inter', sans-serif;
  color:var(--ink);
  overflow-x:hidden;
}

.menorah-landing .font-display{
  font-family:'Baloo 2', sans-serif;
  font-weight:700;
}

.menorah-landing section{ position:relative; }

/* bars motif — echoes the logo's row of candles */
.menorah-bars{ display:inline-flex; gap:6px; align-items:flex-end; }
.menorah-bars span{
  display:block;
  width:8px;
  border-radius:5px;
  opacity:0;
  transform:translateY(10px);
  animation:barRise .5s cubic-bezier(.34,1.56,.64,1) forwards;
}
.menorah-bars span:nth-child(1){ height:18px; background:#6B2FA6; animation-delay:.05s; }
.menorah-bars span:nth-child(2){ height:26px; background:#D1478E; animation-delay:.1s; }
.menorah-bars span:nth-child(3){ height:20px; background:#F2C94C; animation-delay:.15s; }
.menorah-bars span:nth-child(4){ height:32px; background:#E8813A; animation-delay:.2s; }
.menorah-bars span:nth-child(5){ height:20px; background:#E1543A; animation-delay:.25s; }
.menorah-bars span:nth-child(6){ height:26px; background:#6FB854; animation-delay:.3s; }
.menorah-bars span:nth-child(7){ height:18px; background:#3E9AD6; animation-delay:.35s; }
@keyframes barRise{ to{ opacity:1; transform:translateY(0); } }

/* ---- hero ---- */
.menorah-hero{
  background:radial-gradient(120% 90% at 50% -10%, #3A2270 0%, var(--deep) 55%, var(--deep) 100%);
  padding:5rem 1.25rem 6rem;
  text-align:center;
  overflow:hidden;
}
.menorah-hero .rays{
  position:absolute; inset:0; pointer-events:none;
  background:conic-gradient(from 0deg at 50% 30%, transparent 0deg, rgba(217,169,76,0.16) 8deg, transparent 20deg, transparent 340deg, rgba(217,169,76,0.16) 352deg, transparent 360deg);
  animation:rayTurn 60s linear infinite;
}
@keyframes rayTurn{ to{ transform:rotate(360deg); } }

.menorah-hero .stars{ position:absolute; inset:0; pointer-events:none; }
.menorah-hero .stars span{
  position:absolute; width:3px; height:3px; border-radius:50%; background:#F2DDA6;
  opacity:.7; animation:twinkle 3.5s ease-in-out infinite;
}
@keyframes twinkle{ 0%,100%{ opacity:.15; } 50%{ opacity:.85; } }

.menorah-hero .cross{
  width:2px; height:64px; background:linear-gradient(180deg,#FFF7E0,#D9A94C);
  margin:0 auto; position:relative; box-shadow:0 0 24px 6px rgba(242,221,166,.5);
}
.menorah-hero .cross::before{
  content:''; position:absolute; top:16px; left:-13px; width:28px; height:2px;
  background:linear-gradient(90deg,#D9A94C,#FFF7E0,#D9A94C);
}

.menorah-hero h1{
  font-size:clamp(2.1rem, 5.5vw, 3.6rem);
  line-height:1.08;
  color:#F8F4FF;
  margin:1.5rem auto 1rem;
  max-width:18ch;
}
.menorah-hero h1 .accent{
  background:linear-gradient(90deg,#F2DDA6,#D9A94C);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.menorah-hero p.lede{
  color:#C9B8E8; font-size:1.05rem; max-width:44ch; margin:0 auto 2rem; line-height:1.65;
}

.btn-gold{
  background:var(--gold); color:#241705; font-family:'Baloo 2',sans-serif; font-weight:600;
  padding:0.85rem 1.75rem; border-radius:999px; text-decoration:none; display:inline-block;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s ease;
  box-shadow:0 8px 24px -8px rgba(217,169,76,0.45);
}
.btn-gold:hover{ transform:translateY(-2px); }

.btn-ghost{
  border:1px solid rgba(248,244,255,0.28); color:#F8F4FF; font-family:'Baloo 2',sans-serif; font-weight:600;
  padding:0.85rem 1.75rem; border-radius:999px; text-decoration:none; display:inline-block;
  transition:background .25s ease, transform .25s cubic-bezier(.34,1.56,.64,1);
}
.btn-ghost:hover{ background:rgba(248,244,255,0.08); transform:translateY(-2px); }

/* ---- reveal on scroll ---- */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }

/* ---- mission strip ---- */
.menorah-mission{ background:var(--canvas); padding:4.5rem 1.25rem; text-align:center; }
.menorah-mission p{ max-width:52ch; margin:0 auto; font-size:1.15rem; line-height:1.7; color:var(--ink); }

/* ---- impact cards ---- */
.menorah-impact{ background:var(--canvas); padding:1rem 1.25rem 5rem; }
.impact-grid{ max-width:64rem; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.25rem; }
.impact-card{
  background:#FFFFFF; border:1px solid var(--line); border-radius:16px; padding:1.5rem;
  transition:transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s ease;
}
.impact-card:hover{ transform:translateY(-4px); box-shadow:0 16px 32px -16px rgba(43,24,84,0.18); }
.impact-card .icon-wrap{
  width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center; margin-bottom:0.9rem;
}
.impact-card h3{ font-family:'Baloo 2',sans-serif; font-size:1.05rem; margin:0 0 0.4rem; color:var(--ink); }
.impact-card p{ font-size:0.88rem; color:var(--ink-muted); margin:0; line-height:1.55; }

/* ---- three-step band ---- */
.menorah-steps{ background:linear-gradient(180deg,var(--canvas-2),var(--canvas)); padding:5rem 1.25rem; }
.steps-grid{ max-width:64rem; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:2rem; }
.step-item{ text-align:center; }
.step-icon{
  width:64px; height:64px; border-radius:50%; margin:0 auto 1rem; display:flex; align-items:center; justify-content:center;
  background:#FFFFFF; box-shadow:0 10px 24px -12px rgba(43,24,84,0.25);
}
.step-item h3{ font-family:'Baloo 2',sans-serif; font-size:1.1rem; margin:0 0 0.4rem; color:var(--ink); }
.step-item p{ font-size:0.9rem; color:var(--ink-muted); max-width:28ch; margin:0 auto; line-height:1.55; }

/* ---- gallery ---- */
.menorah-gallery{ background:var(--canvas); padding:1rem 1.25rem 5rem; }
.gallery-grid{ max-width:64rem; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
.gallery-grid img{ width:100%; height:280px; object-fit:cover; border-radius:16px; display:block; }
@media (max-width:640px){ .gallery-grid{ grid-template-columns:1fr; } .gallery-grid img{ height:220px; } }

/* ---- CTA banner ---- */
.menorah-cta{
  background:linear-gradient(120deg,var(--deep-2),var(--purple-strong) 60%, #6E3AB0);
  padding:4.5rem 1.25rem; text-align:center;
}
.menorah-cta h2{ color:#FFF9EC; font-size:clamp(1.6rem,3.5vw,2.4rem); margin:0 0 0.75rem; }
.menorah-cta p{ color:#D9C9F0; max-width:44ch; margin:0 auto 2rem; }

@media (prefers-reduced-motion: reduce){
  .menorah-bars span, .reveal, .menorah-hero .rays, .menorah-hero .stars span{
    animation:none !important; opacity:1 !important; transform:none !important;
  }
}
