:root{
  --zp-bg:#070A12;
  --zp-panel:rgba(255,255,255,.06);
  --zp-panel2:rgba(255,255,255,.10);
  --zp-stroke:rgba(255,255,255,.12);
  --zp-text:rgba(255,255,255,.92);
  --zp-muted:rgba(255,255,255,.70);
  --zp-fresh:#8BFF7B;
  --zp-citrus:#FFD36A;
  --zp-grape:#B6A2FF;
  --zp-fire:#FF7A6E;
  --zp-shadow: 0 22px 70px rgba(0,0,0,.45);
  --zp-radius: 22px;
  --zp-radius-sm: 14px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  color:var(--zp-text);
  background:
    radial-gradient(1200px 900px at 10% -10%, rgba(139,255,123,.25), transparent 60%),
    radial-gradient(1000px 850px at 90% 10%, rgba(255,211,106,.20), transparent 55%),
    radial-gradient(900px 700px at 65% 105%, rgba(182,162,255,.18), transparent 55%),
    linear-gradient(180deg, #070A12 0%, #070A12 55%, #050812 100%);
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  line-height:1.45;
}

a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:underline; text-decoration-color: rgba(255,255,255,.35); }

.zp-shell{ width:min(1180px, calc(100% - 40px)); margin:0 auto; }

.zp-topbar{
  position:sticky; top:0; z-index:40;
  backdrop-filter: blur(14px);
  background: linear-gradient(180deg, rgba(7,10,18,.92) 0%, rgba(7,10,18,.70) 100%);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.zp-topbar__in{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 0;
  gap:16px;
}
.zp-brand{
  display:flex; align-items:center; gap:12px;
  font-weight:750; letter-spacing:.2px;
}
.zp-brand__mark{
  width:38px; height:38px; border-radius:14px;
  background:
    radial-gradient(22px 22px at 30% 30%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(32px 32px at 70% 70%, rgba(139,255,123,.42), transparent 62%),
    linear-gradient(135deg, rgba(255,122,110,.85), rgba(182,162,255,.65));
  box-shadow: 0 16px 38px rgba(182,162,255,.18);
  border:1px solid rgba(255,255,255,.10);
}
.zp-nav{
  display:flex; align-items:center; gap:16px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.zp-nav a{
  padding:8px 10px;
  border-radius:12px;
  color:var(--zp-muted);
}
.zp-nav a:hover{
  background: rgba(255,255,255,.06);
  text-decoration:none;
  color:var(--zp-text);
}
.zp-cta{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 14px;
  border-radius:16px;
  background: linear-gradient(135deg, rgba(139,255,123,.20), rgba(255,211,106,.14));
  border:1px solid rgba(255,255,255,.12);
  box-shadow: 0 14px 40px rgba(0,0,0,.22);
}
.zp-cta:hover{ text-decoration:none; filter:brightness(1.06); }

.zp-hero{
  padding:48px 0 28px;
  position:relative;
}
.zp-hero__grid{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap:24px;
  align-items:stretch;
}
.zp-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--zp-muted);
  font-size:14px;
  padding:8px 12px;
  border-radius:999px;
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
}
.zp-kicker__dot{
  width:10px; height:10px; border-radius:99px;
  background: radial-gradient(circle, var(--zp-fresh), rgba(139,255,123,.25));
  box-shadow: 0 0 0 6px rgba(139,255,123,.08);
}
.zp-title{
  margin:14px 0 10px;
  font-weight:820;
  letter-spacing:-.6px;
  font-size: clamp(30px, 4.2vw, 54px);
  line-height:1.05;
}
.zp-title__glow{
  background: linear-gradient(90deg, rgba(139,255,123,1), rgba(255,211,106,1), rgba(182,162,255,1));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.zp-lead{
  color:var(--zp-muted);
  font-size: clamp(15px, 1.6vw, 18px);
  max-width: 62ch;
  margin: 0 0 18px;
}
.zp-actions{ display:flex; gap:12px; flex-wrap:wrap; }
.zp-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:12px 16px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color:var(--zp-text);
  font-weight:650;
}
.zp-btn:hover{ text-decoration:none; filter:brightness(1.08); }
.zp-btn--prime{
  background: linear-gradient(135deg, rgba(139,255,123,.22), rgba(255,122,110,.16));
}
.zp-btn__hint{ color:var(--zp-muted); font-weight:550; }

.zp-card{
  border-radius: var(--zp-radius);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.11);
  box-shadow: var(--zp-shadow);
}
.zp-side{
  padding:18px;
  position:relative;
  overflow:hidden;
}
.zp-side:before{
  content:"";
  position:absolute; inset:-60px -60px auto auto;
  width:240px; height:240px;
  background: radial-gradient(circle, rgba(255,211,106,.28), transparent 60%);
  transform: rotate(18deg);
}
.zp-side__title{
  margin:0 0 10px;
  font-size:18px;
  letter-spacing:.2px;
}
.zp-side__list{ margin:0; padding:0; list-style:none; display:grid; gap:10px; }
.zp-side__li{
  display:flex; gap:10px; align-items:flex-start;
  padding:10px 12px;
  border-radius:16px;
  background: rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.10);
}
.zp-pill{
  width:10px; height:10px; border-radius:999px; margin-top:6px;
  background: var(--zp-fresh);
  box-shadow: 0 0 0 6px rgba(139,255,123,.08);
}
.zp-pill--citrus{ background: var(--zp-citrus); box-shadow: 0 0 0 6px rgba(255,211,106,.08); }
.zp-pill--grape{ background: var(--zp-grape); box-shadow: 0 0 0 6px rgba(182,162,255,.08); }

.zp-section{ padding: 38px 0; }
.zp-section__head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:14px;
  margin-bottom:16px;
}
.zp-h2{
  margin:0;
  font-size: clamp(22px, 2.2vw, 30px);
  letter-spacing:-.2px;
}
.zp-sub{
  margin:0;
  color:var(--zp-muted);
  max-width: 70ch;
}

.zp-grid{
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  gap:14px;
}
.zp-tile{
  grid-column: span 6;
  padding:18px;
  border-radius: var(--zp-radius);
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.11);
  position:relative;
  overflow:hidden;
}
.zp-tile:before{
  content:"";
  position:absolute; inset:auto -80px -90px auto;
  width:280px; height:280px;
  background: radial-gradient(circle, rgba(182,162,255,.20), transparent 60%);
}
.zp-tile__k{ color:var(--zp-muted); font-size:13px; }
.zp-tile__t{ margin:8px 0 8px; font-size:18px; letter-spacing:.1px; }
.zp-tile__p{ margin:0; color:var(--zp-muted); }
.zp-tagrow{ margin-top:12px; display:flex; gap:8px; flex-wrap:wrap; }
.zp-tag{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  color:var(--zp-muted);
}
.zp-tag--fresh{ color:rgba(139,255,123,.92); }
.zp-tag--citrus{ color:rgba(255,211,106,.92); }
.zp-tag--grape{ color:rgba(182,162,255,.92); }
.zp-tag--fire{ color:rgba(255,122,110,.92); }

.zp-recipe{
  grid-column: span 4;
  padding:18px;
  border-radius: var(--zp-radius);
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.11);
}
.zp-recipe__top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.zp-badge{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.18);
  color:var(--zp-muted);
}
.zp-badge--fresh{ border-color: rgba(139,255,123,.25); color: rgba(139,255,123,.92); }
.zp-badge--citrus{ border-color: rgba(255,211,106,.25); color: rgba(255,211,106,.92); }
.zp-badge--grape{ border-color: rgba(182,162,255,.25); color: rgba(182,162,255,.92); }
.zp-badge--fire{ border-color: rgba(255,122,110,.25); color: rgba(255,122,110,.92); }
.zp-recipe__h{
  margin:12px 0 8px;
  font-size:18px;
}
.zp-recipe__txt{
  margin:0 0 12px;
  color:var(--zp-muted);
}
.zp-steps{
  margin:0; padding-left:18px;
  color:var(--zp-muted);
  display:grid; gap:6px;
}

.zp-split{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
  align-items:stretch;
}
.zp-panel{
  padding:18px;
  border-radius: var(--zp-radius);
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.11);
}
.zp-form{
  display:grid; gap:10px;
  margin-top:10px;
}
.zp-field{
  display:grid; gap:6px;
}
.zp-label{ font-size:12px; color:var(--zp-muted); }
.zp-input, .zp-select, .zp-textarea{
  width:100%;
  padding:12px 12px;
  border-radius: 16px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.18);
  color: var(--zp-text);
  outline:none;
}
.zp-input::placeholder, .zp-textarea::placeholder{ color: rgba(255,255,255,.40); }
.zp-textarea{ min-height: 92px; resize:vertical; }
.zp-form__row{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
}
.zp-note{
  margin:10px 0 0;
  color: var(--zp-muted);
  font-size: 12px;
}

.zp-map{
  width:100%;
  height: 340px;
  border-radius: var(--zp-radius);
  border:1px solid rgba(255,255,255,.11);
  overflow:hidden;
  box-shadow: var(--zp-shadow);
}

.zp-faq{
  display:grid; gap:10px;
}
.zp-q{
  border-radius: 18px;
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.11);
  overflow:hidden;
}
.zp-q button{
  width:100%;
  text-align:left;
  padding:14px 14px;
  background:transparent;
  border:0;
  color:var(--zp-text);
  font-weight:700;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
}
.zp-q__a{
  padding:0 14px 14px;
  color:var(--zp-muted);
  display:none;
}
.zp-q[data-open="1"] .zp-q__a{ display:block; }
.zp-q__icon{
  width:22px; height:22px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.18);
  display:grid; place-items:center;
  flex:0 0 auto;
}

.zp-footer{
  padding: 34px 0 48px;
  border-top: 1px solid rgba(255,255,255,.08);
  margin-top: 18px;
}
.zp-footer__in{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:14px; flex-wrap:wrap;
}
.zp-footlinks{ display:flex; gap:12px; flex-wrap:wrap; }
.zp-footlinks a{ color:var(--zp-muted); padding:6px 8px; border-radius:12px; }
.zp-footlinks a:hover{ background: rgba(255,255,255,.06); text-decoration:none; color:var(--zp-text); }
.zp-copy{ color:var(--zp-muted); font-size:12px; margin:0; }

@media (max-width: 980px){
  .zp-hero__grid{ grid-template-columns: 1fr; }
  .zp-form__row{ grid-template-columns: 1fr; }
  .zp-split{ grid-template-columns: 1fr; }
  .zp-tile{ grid-column: span 12; }
  .zp-recipe{ grid-column: span 12; }
}

/* Leaflet readability tweaks */
.leaflet-container{ background: #0B1022; }
.leaflet-control-attribution{
  background: rgba(0,0,0,.42) !important;
  color: rgba(255,255,255,.70) !important;
  border-radius: 12px !important;
  border:1px solid rgba(255,255,255,.10) !important;
}

