/* ===== ספקי אירועים — vendor directory. Ethiopian-flag / Cotton & Thread palette. ===== */
:root {
  --green:#1C7C49; --green-d:#155F38;
  --gold:#FFC233; --gold-d:#E9A400;
  --red:#E24A3B; --red-t:#B5392D;
  --surface:#FDFBF5; --cream:#F8F3E7; --cream-2:#F3ECD9; --white:#FFFFFF;
  --ink:#1C1B16; --muted:#5A5443; --line:#ECE4CB;
  --shadow:0 6px 24px rgba(28,124,73,.09); --shadow-lg:0 14px 36px rgba(28,124,73,.14);
  --r:16px;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--surface); color:var(--ink); font-family:"Heebo","Rubik",system-ui,sans-serif; line-height:1.6; -webkit-font-smoothing:antialiased; }
h1,h2,h3,.brand-text { font-family:"Rubik","Heebo",sans-serif; }
a { color:inherit; text-decoration:none; }
.wrap { width:min(1160px,92vw); margin-inline:auto; }
.btn { display:inline-block; padding:11px 22px; border-radius:999px; font-weight:600; font-family:"Rubik",sans-serif; cursor:pointer; border:2px solid transparent; transition:.18s; }
.btn-green { background:var(--green); color:#fff; }
.btn-green:hover { background:var(--green-d); }

/* nav */
.nav { position:sticky; top:0; z-index:40; background:rgba(253,251,245,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.nav-inner { display:flex; align-items:center; justify-content:space-between; height:66px; }
.brand { display:flex; align-items:center; gap:11px; }
.brand-text { font-weight:800; font-size:20px; line-height:1; display:flex; flex-direction:column; gap:3px; }
.brand-text small { font-weight:500; font-size:11px; color:var(--muted); font-family:"Heebo"; }
.nav-home { font-weight:500; color:var(--muted); font-size:14px; }
.nav-home:hover { color:var(--green); }

/* hero */
.hero { padding:52px 0 26px; background:radial-gradient(900px 300px at 12% -20%, rgba(28,124,73,.10), transparent 60%); }
.eyebrow { display:inline-flex; align-items:center; gap:8px; background:var(--white); border:1px solid var(--line); padding:6px 14px; border-radius:999px; font-size:13px; font-weight:600; color:var(--muted); box-shadow:var(--shadow); }
.eyebrow .flag { width:20px; height:13px; border-radius:3px; display:inline-block; background:linear-gradient(var(--green) 0 33%, var(--gold) 33% 66%, var(--red) 66% 100%); }
.hero h1 { font-size:clamp(28px,4.4vw,44px); font-weight:800; margin:16px 0 12px; letter-spacing:-.5px; }
.hero h1 .hl { color:var(--green); }
.hero .lead { font-size:17px; color:var(--muted); max-width:48em; margin:0; }

/* controls */
.controls { display:flex; gap:12px; padding:22px 0 6px; flex-wrap:wrap; }
.search { flex:1; min-width:220px; padding:12px 18px; border:1.5px solid var(--line); border-radius:999px; font-family:"Heebo"; font-size:15px; background:var(--white); }
.search:focus { outline:none; border-color:var(--green); }
.area { padding:12px 18px; border:1.5px solid var(--line); border-radius:999px; font-family:"Heebo"; font-size:15px; background:var(--white); cursor:pointer; min-width:150px; }
.area:focus { outline:none; border-color:var(--green); }

/* category chips */
.cats { display:flex; flex-wrap:wrap; gap:9px; padding:14px 0 4px; }
.chip { padding:8px 16px; border-radius:999px; border:1.5px solid var(--line); background:var(--white); font-weight:600; font-size:14px; cursor:pointer; transition:.15s; font-family:"Rubik"; }
.chip:hover { border-color:var(--green); }
.chip.active { background:var(--green); color:#fff; border-color:var(--green); }

.count { color:var(--muted); font-size:14px; margin:18px 0 4px; }
.empty { text-align:center; color:var(--muted); padding:40px 0 60px; }

/* vendor grid */
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:20px; padding:10px 0 56px; }
.card { background:var(--white); border:1px solid var(--line); border-radius:var(--r); padding:20px; box-shadow:var(--shadow); display:flex; flex-direction:column; transition:.2s; }
.card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.card-head { display:flex; gap:14px; align-items:flex-start; }
.avatar { width:54px; height:54px; border-radius:14px; display:grid; place-items:center; font-size:28px; background:var(--cream-2); flex:0 0 auto; }
.card-title { flex:1; }
.card-title h3 { font-size:18px; margin:0 0 4px; }
.badges { display:flex; flex-wrap:wrap; gap:6px; }
.badge { font-size:12px; font-weight:600; padding:3px 10px; border-radius:999px; background:rgba(28,124,73,.10); color:var(--green); }
.badge.area { background:var(--cream-2); color:var(--muted); }
.rating { display:flex; align-items:center; gap:3px; font-family:"Rubik"; font-weight:700; font-size:14px; color:var(--gold-d); white-space:nowrap; }
.desc { color:var(--muted); font-size:14px; margin:14px 0 16px; flex:1; }
.contacts { display:flex; gap:10px; }
.contacts a { flex:1; text-align:center; padding:10px; border-radius:999px; font-weight:600; font-family:"Rubik"; font-size:14px; transition:.15s; }
.c-wa { background:var(--green); color:#fff; }
.c-wa:hover { background:var(--green-d); }
.c-call { background:var(--white); border:1.5px solid var(--line); color:var(--ink); }
.c-call:hover { border-color:var(--green); color:var(--green); }

/* join CTA */
.join { background:var(--cream); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.join-inner { display:flex; align-items:center; justify-content:space-between; gap:22px; padding:30px 0; flex-wrap:wrap; }
.join h2 { margin:0 0 6px; font-size:22px; }
.join p { margin:0; color:var(--muted); }

/* footer */
.footer { background:var(--ink); color:#EDE7D6; }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:28px 0; flex-wrap:wrap; }
.footer .brand-text { color:#fff; }
.footer .brand-text small { color:#B6AF9C; }
.footer-note { font-size:13px; color:#B6AF9C; margin:0; }
.flag-strip { display:flex; height:6px; }
.flag-strip i { flex:1; }
.flag-strip i:nth-child(1){ background:var(--green); } .flag-strip i:nth-child(2){ background:var(--gold); } .flag-strip i:nth-child(3){ background:var(--red); }
