
:root{
  --bg:#f6f7f8;
  --surface:#fff;
  --text:#111827;
  --muted:#6b7280;
  --line:rgba(17,24,39,.12);
  --green:#22c55e;
  --green2:#16a34a;
  --r:18px;
  --shadow:0 16px 50px rgba(17,24,39,.10);
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--text);
  background: radial-gradient(1200px 420px at 20% -10%, rgba(34,197,94,.16), transparent 70%),
              radial-gradient(900px 320px at 90% 0%, rgba(17,24,39,.10), transparent 65%),
              var(--bg);
}

h1, h2{
color: #000;
}

.zz-header{
  position:sticky; top:0; z-index:30;
  backdrop-filter:blur(12px);
  background:rgba(246,247,248,.85);
  border-bottom:1px solid var(--line);
}
.zz-header-inner{
  max-width:980px; margin:0 auto; padding:12px 14px;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.zz-brand{display:flex; align-items:center; gap:10px; min-width:0;}
.zz-logo{
  width:44px; height:44px; border-radius:14px; overflow:hidden;
  background:linear-gradient(135deg,var(--green),var(--green2));
  box-shadow:0 18px 60px rgba(34,197,94,.24);
  display:grid; place-items:center;
  flex:0 0 auto;
}
.zz-logo img{width:100%;height:100%;object-fit:cover}
.zz-title{line-height:1.1; min-width:0;}
.zz-title b{display:block; font-size:16px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.zz-title span{display:block; font-size:12px; color:var(--muted); font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.zz-chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 10px; border-radius:999px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.75);
  font-weight:800; font-size:12px;
}
.zz-chip i{width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 0 4px rgba(34,197,94,.16);}
.zz-wrap{max-width:980px; margin:0 auto; padding:14px 14px 140px;}
.zz-h1{font-size:22px; margin:14px 0 6px; font-weight:900;}
.zz-lead{margin:0 0 14px; color:var(--muted); font-weight:600;}
.zz-card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--r);
  box-shadow:0 10px 36px rgba(17,24,39,.06);
  padding:14px;
}
.zz-card + .zz-card{margin-top:12px;}
.zz-card-head{display:flex; gap:10px; align-items:flex-start; margin-bottom:12px;}
.zz-step{
  width:34px; height:34px; border-radius:12px;
  background:linear-gradient(135deg,var(--green),var(--green2));
  color:#fff; display:grid; place-items:center; font-weight:900;
  box-shadow:0 16px 40px rgba(34,197,94,.22);
  flex:0 0 auto;
}
.zz-h3{margin:0; font-size:15px; font-weight:900;}
.zz-sub{margin:2px 0 0; color:var(--muted); font-size:12px; font-weight:700;}
.zz-grid{display:grid; gap:10px;}
.zz-grid-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.zz-grid-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.zz-grid-4{grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:520px){
  .zz-grid-3{grid-template-columns:repeat(2,minmax(0,1fr));}
  .zz-grid-4{grid-template-columns:repeat(2,minmax(0,1fr));}
}
.zz-btn{
  position:relative;
  border:1.5px solid rgba(17,24,39,.14);
  background:#fff;
  border-radius:14px;
  padding:12px 12px;
  cursor:pointer;
  text-align:left;
  font-weight:900;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.zz-btn small{display:block; margin-top:2px; font-size:11px; font-weight:700; color:var(--muted);}
.zz-btn:hover{transform:translateY(-1px); box-shadow:var(--shadow);}
.zz-btn.is-active{
  border-color:rgba(34,197,94,.60);
  background:linear-gradient(135deg, rgba(34,197,94,.09), rgba(34,197,94,.02));
  box-shadow:0 18px 55px rgba(34,197,94,.16);
}
.zz-btn.is-active::after{
  content:"✓";
  position:absolute; top:10px; right:10px;
  width:22px; height:22px; border-radius:999px;
  background:linear-gradient(135deg,var(--green),var(--green2));
  color:#fff; display:grid; place-items:center;
  font-weight:900; font-size:12px;
}
.zz-row{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
.zz-input{
  width:100%;
  padding:12px 12px;
  border:1.5px solid rgba(17,24,39,.14);
  border-radius:14px;
  font-size:14px;
  font-weight:900;
  outline:none;
}
.zz-input:focus{
  border-color:rgba(34,197,94,.65);
  box-shadow:0 0 0 5px rgba(34,197,94,.10);
}
.zz-mini{
  font-size:12px; color:var(--muted); font-weight:700; margin-top:6px;
}
.zz-add{
  border:2px dashed rgba(34,197,94,.35);
  background:rgba(255,255,255,.65);
  border-radius:14px;
  padding:12px;
  font-weight:900;
  cursor:pointer;
}
.zz-del{
  border:1.5px solid rgba(239,68,68,.25);
  background:rgba(239,68,68,.05);
  color:#b91c1c;
  border-radius:12px;
  padding:10px 12px;
  font-weight:900;
  cursor:pointer;
}
.zz-sticky{
  position:fixed; left:0; right:0; bottom:0; z-index:40;
  background:rgba(17,24,39,.92);
  backdrop-filter:blur(12px);
  border-top:1px solid rgba(255,255,255,.10);
}
.zz-sticky-inner{
  max-width:980px; margin:0 auto; padding:12px 14px;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.zz-total{
  color:#fff; line-height:1.1; padding-right:110px; /* под виджеты */
}
.zz-total small{display:block; color:rgba(255,255,255,.65); font-weight:800;}
.zz-total b{font-size:22px;}
@media (max-width:520px){ .zz-total b{font-size:18px;} }
.zz-cta{
  border:0; border-radius:16px;
  padding:12px 14px;
  background:linear-gradient(135deg,var(--green),var(--green2));
  color:#fff; font-weight:900; cursor:pointer;
  box-shadow:0 18px 60px rgba(34,197,94,.25);
}
.zz-note{
  max-width:980px; margin:0 auto;
  padding:0 14px 12px;
  color:rgba(255,255,255,.70);
  font-size:12px;
  font-weight:800;
}


/* === WOW v14 additions === */

*{font-family:'Montserrat',system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;}
.zz-wrap{padding-bottom:260px;}
.zz-h1{font-size:28px; letter-spacing:-0.02em;}
.zz-lead{font-size:14px; color:var(--muted); font-weight:600;}
.Zz-badges{display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin:10px 0 18px;}
.Zz-badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 12px;
  border:1px solid rgba(17,24,39,.10);
  border-radius:999px;
  background:rgba(255,255,255,.85);
  box-shadow:0 14px 40px rgba(17,24,39,.06);
  font-weight:800; font-size:12px; color:#111827;
}
.Zz-badge .dot{
  width:8px; height:8px; border-radius:50%;
  background:var(--green);
  box-shadow:0 0 0 4px rgba(34,197,94,.18);
}
.zz-card{
  border:1px solid rgba(17,24,39,.10);
  box-shadow:0 22px 70px rgba(17,24,39,.10);
}
.zz-card-head{margin-bottom:14px;}
.zz-step{
  width:40px; height:40px; border-radius:14px;
  box-shadow:0 20px 55px rgba(34,197,94,.22);
  font-weight:900;
}
.zz-btn{
  border:1.5px solid rgba(17,24,39,.12);
  border-radius:16px;
  padding:12px 12px;
  background:rgba(255,255,255,.92);
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
  min-height:54px;
}
.zz-btn:hover{transform:translateY(-1px); box-shadow:0 18px 55px rgba(17,24,39,.12);}
.zz-btn.is-active{
  border-color:rgba(34,197,94,.55);
  background:linear-gradient(135deg, rgba(34,197,94,.12), rgba(34,197,94,.04));
  box-shadow:0 22px 70px rgba(34,197,94,.16);
}
.zz-btn.is-active::after{
  content:"✓";
  position:absolute;
  right:10px; top:10px;
  width:22px; height:22px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--green),var(--green2));
  color:#fff;
  display:grid; place-items:center;
  font-weight:900;
}
.zz-input{border-radius:16px; padding:12px 14px;}
.zz-add{
  border-radius:16px;
  padding:12px 14px;
  background:rgba(255,255,255,.85);
  border:1.5px dashed rgba(34,197,94,.55);
  font-weight:900;
}
.zz-del{
  border-radius:14px;
  border:1px solid rgba(239,68,68,.25);
  background:rgba(255,255,255,.8);
  font-weight:900;
}
.zz-sticky{
  background:rgba(17,24,39,.94);
}
#zzTotal{
  color:#fff !important;
  font-size:22px;
  white-space:nowrap;
}
.zz-total small{color:rgba(255,255,255,.70);}
.zz-cta{
  border-radius:18px;
  padding:12px 16px;
  font-weight:900;
}
.zz-note{
  padding:0 14px 14px;
  max-width:980px;
  margin:0 auto;
  font-weight:700;
  color:rgba(255,255,255,.72);
  font-size:12px;
}
@media (max-width:520px){
  .zz-header-inner{padding:10px 12px;}
  .zz-h1{font-size:24px;}
  #zzTotal{font-size:18px;}
  .zz-sticky-inner{gap:8px;}
  /* защита от перекрытия Jivo/WhatsApp */
  .zz-total{padding-right:110px;}
}


/* --- WOW mobile + icons patch v15 --- */
.zz-btn, .zz-chip, .zz-del, .zz-primary, input, label { -webkit-tap-highlight-color: rgba(0,0,0,0); }
.zz-btn{ color:#0b1b15; }
.zz-btn strong{ color:#0b1b15; font-size:15px; line-height:1.15; }
.zz-btn small{ color:#5b6b66; font-size:12px; line-height:1.15; }

.zz-ico{
  width:30px; height:30px; border-radius:12px;
  background-color:#eef6f1;
  background-repeat:no-repeat; background-position:center; background-size:18px 18px;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.06);
}
.zz-btn{ gap:6px; }
.zz-btn{ flex-direction:column; justify-content:center; }
.zz-btn .zz-ico{ margin-bottom:4px; }

@media (max-width: 420px){
  .zz-wrap{ padding:14px 12px 90px; }
  .zz-card{ padding:14px; }
  .zz-h1{ font-size:28px; }
  .zz-subtitle{ font-size:14px; }
  .zz-grid-3{ grid-template-columns: repeat(2, 1fr); }
  .zz-grid-4{ grid-template-columns: repeat(2, 1fr); }
  .zz-btn strong{ font-size:15px; }
  .zz-btn{ padding:12px 10px; min-height:72px; }
  .zz-chip{ font-size:14px; padding:12px 10px; }
}
/* prevent any overlay layer blocking clicks inside calculator */
.zz-root, .zz-wrap, .zz-card, .zz-grid, .zz-btn, .zz-chip, .zz-primary, .zz-del, .zz-sticky{ position:relative; }
.zz-sticky{ z-index: 9999; }

.zz-ico-proflist{background-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%252309a35a%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%204h16v16H4z%20M8%208h8%20M8%2012h8%20M8%2016h8%27/%3E%3C/svg%3E');}

.zz-ico-shtaket{background-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%252309a35a%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M6%204v16%20M10%204v16%20M14%204v16%20M18%204v16%27/%3E%3C/svg%3E');}

.zz-ico-3d{background-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%252309a35a%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M6%206h12v12H6z%20M6%2012h12%20M12%206v12%27/%3E%3C/svg%3E');}

.zz-ico-rabica{background-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%252309a35a%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M6%206l12%2012%20M18%206L6%2018%27/%3E%3C/svg%3E');}

.zz-ico-gate{background-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%252309a35a%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M5%2020V6h14v14%20M9%206V4h6v2%27/%3E%3C/svg%3E');}

.zz-ico-wicket{background-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%252309a35a%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M7%2020V6h10v14%27/%3E%3C/svg%3E');}

.zz-ico-ppk{background-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%252309a35a%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M6%2012l4%204%208-8%27/%3E%3C/svg%3E');}

.zz-ico-primer{background-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%252309a35a%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%2020h16%20M6%2018V6h12v12%27/%3E%3C/svg%3E');}

.zz-ico-plus{background-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%252309a35a%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%205v14%20M5%2012h14%27/%3E%3C/svg%3E');}

.zz-ico-trash{background-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%252309a35a%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%207h16%20M10%2011v6%20M14%2011v6%20M9%207l1-2h4l1%202%20M6%207l1%2014h10l1-14%27/%3E%3C/svg%3E');}
