:root{
  --bg:#ffffff;
  --fg:#1f2937;
  --muted:#4b5563;

  --pink:#c02656;
  --green:#16a34a;
  --teal:#0ea5a4;
  --blue:#60a5fa;

  --box:#ffffff;
  --border:#d1d5db;
  --shadow:0 10px 30px rgba(2,6,23,0.10);

  --maxw: 980px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: system-ui, -apple-system, "Segoe UI", Arial, "Noto Sans Hebrew", "Heebo", sans-serif;
  line-height:1.6;
  color:var(--fg);
  background: var(--bg);
}

a{color:inherit}

/* Header */
header{
  position:sticky;
  top:0;
  background:rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  border-bottom:1px solid #e5e7eb;
  z-index:50;
}
.container{max-width:var(--maxw); margin:0 auto; padding:14px 16px}
.nav{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap}
.brand{font-weight:800}
.links{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.links a{
  font-weight:800;
  text-decoration:none;
  padding:8px 12px;
  border-radius:999px;
  color:var(--fg);
  background:#fff;
  border:1px solid rgba(0,0,0,0.12);
  box-shadow: 0 4px 10px rgba(2,6,23,0.06);
}
.links a:hover{background:rgba(2,6,23,0.04)}
.links a:focus{outline:2px solid rgba(96,165,250,0.55); outline-offset:2px}

/* Mobile: keep menu in one scrollable row */
@media (max-width: 520px){
  .links{flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:6px}
  .links::-webkit-scrollbar{display:none}
}

/* Hero */
.hero{
  background: linear-gradient(90deg, #7ea24a, #b8c36f, #f3c66e, #f5b384);
  border-bottom: 1px solid rgba(0,0,0,0.08);
}
.hero-inner{padding:26px 16px; text-align:center}
.hero-title{margin:0; font-size: clamp(22px, 4.2vw, 34px); font-weight:800}

/* Sections */
.section{padding:18px 0}
.section.gray{background:#ededed}
.section.sky{background: linear-gradient(#a7c9e3, #4ea0c8)}
.section.cloud{background: linear-gradient(#a7c9e3, #8fc7ea)}
.section.pink{background:#f7d9d7}
.section.white{background:#ffffff}

.h-center{text-align:center}
.h1{margin:0 0 8px; font-size:28px; color:#f97316; font-weight:900}
.h2{margin:0 0 10px; font-size:24px; font-weight:900}
.h2.teal{color:var(--teal)}
.h2.blue{color:var(--blue)}
.h2.pink{color:#c02656}
.h2.green{color:#16a34a}

.p{margin:10px 0; color:var(--fg)}
.small{font-size:14px; color:var(--muted)}

.card{
  background:var(--box);
  border:2px solid #1f2937;
  border-radius:8px;
  padding:18px 16px;
  box-shadow: var(--shadow);
}
.card.soft{
  border-color: rgba(0,0,0,0.25);
  border-width:1px;
  border-radius:12px;
  box-shadow: 0 8px 20px rgba(2,6,23,0.10);
}

.grid{display:grid; gap:14px}
@media (min-width: 820px){
  .grid.cols-2{grid-template-columns:1fr 1fr}
  .grid.cols-3{grid-template-columns:1fr 1fr 1fr}
}

.btn{
  display:inline-block;
  padding:14px 18px;
  border-radius:999px;
  font-weight:900;
  text-decoration:none;
  border:2px solid rgba(0,0,0,0.15);
}
.btn.blue{background:#2563eb; color:#fff}
.btn.green{background:#22c55e; color:#fff}
.btn.pink{background:#c02656; color:#fff}
.btn:hover{filter:brightness(0.98)}

/* News ticker */
.ticker-wrap{
  background:#ffffff;
  border-top:1px solid rgba(0,0,0,0.12);
  border-bottom:1px solid rgba(0,0,0,0.12);
  overflow:hidden;
}
.ticker{
  white-space: nowrap;
  display:inline-block;
  padding:10px 0;
  will-change: transform;
  transform: translateX(0);
}
.ticker.is-ready{
  animation: ticker var(--ticker-duration, 30s) linear infinite;
}
@keyframes ticker{
  0% { transform: translateX(0); }
  100% { transform: translateX(50%); }
}

img.resp{width:100%; height:auto; border-radius:12px; border:1px solid var(--border)}

/* Mobile */
@media (max-width: 480px){
  .links a{padding:8px 8px}
  .hero-inner{padding:20px 14px}
}


/* whatsnew ticker */
.whatsnew{margin:12px 0 14px 0;padding:12px 12px;border:1px solid #d7d7d7;border-radius:12px;background:#fffbe6}
.whatsnew__title{font-weight:900;margin-bottom:8px}
.whatsnew__badge{display:inline-block;margin-right:8px;padding:2px 8px;border-radius:999px;background:var(--pink,#ff4d8a);color:#fff;font-size:12px;vertical-align:middle}
.whatsnew__ticker{overflow:hidden;white-space:nowrap;border-radius:10px;background:rgba(255,255,255,0.6);border:1px solid rgba(0,0,0,0.08);padding:10px 12px}
.whatsnew__tickerInner{display:inline-block;will-change:transform;animation:whatsnew-marquee 35s linear infinite}
.whatsnew__ticker:hover .whatsnew__tickerInner{animation-play-state:paused}
.whatsnew__sep{margin:0 10px;opacity:0.8}
.whatsnew__link{text-decoration:underline;font-weight:800}
@keyframes whatsnew-marquee{0%{transform:translateX(100%)}100%{transform:translateX(-100%)}}