/* Вариант 2 «Свежий»: бирюзово-зелёный, яркая шапка с градиентом, мягкие тени */
:root {
  --bg: #f1f8f6;
  --ink: #13302c;
  --muted: #5d7a75;
  --line: #dcebe7;
  --brand: #0e9f8e;
  --brand-dark: #0a7f72;
  --radius: 18px;
}
.top { border: 0; box-shadow: 0 2px 14px rgba(19, 48, 44, .06); }

.hero {
  background: linear-gradient(135deg, #0e9f8e 0%, #1fbf8f 60%, #7fdc8a 100%);
  border-radius: 28px;
  padding: 34px 22px 28px;
  margin-top: 18px;
  color: #fff;
}
.hero h1 { color: #fff; font-size: 34px; }
.hero .hint { color: rgba(255, 255, 255, .92); }
.hero .hero-join a { color: rgba(255, 255, 255, .92); text-decoration: underline; text-underline-offset: 3px; }
.hero .search input { border: 0; box-shadow: 0 10px 28px rgba(0, 0, 0, .18); }
.hero .search button { background: #13302c; }
.hero .search button:hover { background: #0a1c19; }

.cat { border: 0; text-align: center; box-shadow: 0 2px 12px rgba(19, 48, 44, .07); }
.cat .ico {
  width: 58px; height: 58px; margin: 0 auto 8px; border-radius: 50%;
  background: #e0f4ef; display: grid; place-items: center; font-size: 28px;
}
.cat:hover { box-shadow: 0 6px 20px rgba(14, 159, 142, .22); }

.shop-card { border: 0; border-top: 6px solid var(--c, var(--brand)); box-shadow: 0 2px 12px rgba(19, 48, 44, .07); }
.hero .tab { background: rgba(255, 255, 255, .22); border-color: transparent; color: #fff; }
.hero .tab.on { background: #fff; color: #0a7f72; }
.group, .item, .shop-head, .svc { border: 0; box-shadow: 0 2px 12px rgba(19, 48, 44, .07); }
.photo { background: #e8f4f1; }
.chip.on { background: var(--brand); border-color: var(--brand); }
.best { background: #d8f4e6; }