:root {
  --public-blue: #0877ed;
  --public-red: #d90d36;
  --public-ink: #344779;
  --public-line: #dfe3e8;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: #f6f7fb; }
body.public-services-page {
  min-height: 100vh;
  margin: 0;
  color: var(--public-ink);
  background: #f6f7fb;
  font-family: Inter, "Segoe UI", "Microsoft YaHei", Arial, sans-serif;
}
.public-services-page button,
.public-services-page input { font: inherit; }
.public-services-page a { color: inherit; text-decoration: none; }
.public-services-page [hidden] { display: none !important; }
.public-services-page .sr-only {
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  clip-path: inset(50%);
}

.public-services-shell { min-height: 100vh; }
.public-services-header {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 220px 1fr auto;
  align-items: center;
  gap: 80px;
  height: 169px;
  padding: 0 max(48px, calc((100vw - 1100px) / 2));
  overflow: hidden;
  color: #fff;
  background:
    linear-gradient(132deg, transparent 0 13%, rgba(0, 201, 231, .22) 13% 18%, transparent 18% 49%, rgba(0, 198, 229, .18) 49% 56%, transparent 56% 82%, rgba(0, 198, 229, .24) 82% 88%, transparent 88%),
    linear-gradient(115deg, #086ce9 0%, #087cf1 58%, #0691dc 100%);
  border-radius: 0 0 34px 0;
}
.public-services-header::before,
.public-services-header::after {
  position: absolute;
  z-index: -1;
  content: "";
  border-radius: 0 0 100% 0;
  background: rgba(0, 91, 214, .16);
  transform: rotate(-8deg);
}
.public-services-header::before { inset: -110px 62% 38px -80px; }
.public-services-header::after { inset: -130px -70px 18px 78%; }
.public-services-brand { display: inline-flex; align-items: center; width: 150px; height: 88px; }
.public-services-brand img { width: 150px; max-height: 82px; object-fit: contain; }
.public-services-nav { display: flex; justify-content: center; gap: 58px; font-size: 15px; font-weight: 800; }
.public-services-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; white-space: nowrap; }
.public-services-round,
.public-services-login,
.public-services-register {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  border: 2px solid #fff;
  border-radius: 999px;
  color: #fff;
  font-weight: 800;
}
.public-services-round { width: 50px; }
.public-services-login,
.public-services-register { min-width: 125px; gap: 10px; padding: 0 24px; }
.public-services-register { min-width: 118px; border-color: var(--public-red); background: var(--public-red); }

.public-services-main { padding: 24px 48px 70px; }
.public-services-catalog {
  width: 100%;
  margin: 0 auto;
  border-radius: 20px;
  padding: 16px 30px 28px;
  background: #fff;
  box-shadow: 0 4px 20px rgba(36, 52, 92, .04);
}
.public-services-page .services-list { width: 100%; }
.public-services-page .service-catalog-card,
.public-services-page .service-catalog-card > .d-card-body { padding: 0; border: 0; background: transparent; box-shadow: none; }
.public-services-page .sv-platforms {
  overflow-x: auto;
  margin-bottom: 16px;
  border: 1px solid var(--public-line);
  border-radius: 12px;
  padding: 12px 16px;
  background: #fff;
  scrollbar-width: thin;
}
.public-services-page .sv-pill-wrap { display: flex; align-items: center; gap: 8px; min-width: max-content; }
.public-services-page .sv-pill {
  display: grid;
  flex: 0 0 42px;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid #e0e3e9;
  border-radius: 50%;
  color: #d30b36;
  background: #f8f8fa;
  box-shadow: 0 2px 5px rgba(31, 49, 80, .08);
  font-size: 20px;
}
.public-services-page .sv-pill.active { border-color: #ed123f; color: #d30b36; background: #fff; }
.public-services-page .services-filter {
  display: grid;
  grid-template-columns: 267px minmax(260px, 1fr) 44px;
  gap: 28px;
  margin-bottom: 24px;
}
.public-services-page .service-category-dropdown { position: relative; }
.public-services-page .service-category-button {
  display: grid;
  grid-template-columns: 20px 1fr 12px;
  align-items: center;
  width: 100%;
  height: 40px;
  border: 0;
  border-radius: 4px;
  padding: 0 14px;
  color: #fff;
  background: linear-gradient(90deg, #c90d3b, #4059ff);
  font-weight: 800;
  cursor: pointer;
}
.public-services-page .service-category-menu {
  position: absolute;
  z-index: 20;
  top: 46px;
  left: 0;
  width: min(540px, 80vw);
  max-height: 360px;
  overflow-y: auto;
  border-radius: 5px;
  padding: 8px 0;
  background: #11131e;
  box-shadow: 0 18px 42px rgba(19, 31, 57, .32);
}
.public-services-page .service-category-menu button {
  display: block;
  width: 100%;
  border: 0;
  padding: 8px 13px;
  color: #aab2ce;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.public-services-page .service-category-menu button:hover,
.public-services-page .service-category-menu button.active { color: #fff; background: #1d2c54; }
.public-services-page .services-search { display: block; }
.public-services-page .services-search .ss-input {
  width: 100%;
  height: 40px;
  border: 0;
  border-radius: 4px 0 0 4px;
  padding: 0 15px;
  outline: 0;
  color: #35426a;
  background: #e8e8e9;
}
.public-services-page .services-search-button {
  border: 0;
  border-radius: 0 4px 4px 0;
  color: #fff;
  background: var(--public-red);
  cursor: pointer;
}
.public-services-page .services-table-wrap { width: 100%; overflow-x: auto; }
.public-services-page .services-table { width: 100%; min-width: 1050px; border-collapse: collapse; }
.public-services-page .services-table thead { color: #52618d; background: #fff; }
.public-services-page .services-table th {
  height: 48px;
  border-bottom: 2px solid var(--public-line);
  padding: 10px 12px;
  font-size: 14px;
  font-weight: 800;
  text-align: left;
  white-space: nowrap;
}
.public-services-page .services-table td {
  height: 58px;
  border-bottom: 1px solid var(--public-line);
  padding: 10px 12px;
  color: #344779;
  font-size: 14px;
}
.public-services-page .services-table .service-group td {
  height: 66px;
  border: 12px solid #fff;
  border-right-width: 10px;
  border-left-width: 10px;
  border-radius: 18px;
  padding: 12px 25px;
  color: #fff;
  background: linear-gradient(90deg, #3654ff, #453cff);
  font-weight: 800;
}
.public-services-page .services-table .service-group i { color: #ffdf32; }
.public-services-page .service-row:hover td { background: #fafbff; }
.public-services-page .service-favorite { border: 0; color: #24477d; background: transparent; cursor: pointer; font-size: 16px; }
.public-services-page .service-marker { color: #e00e3f; }
.public-services-page .service-price { color: #344779; white-space: nowrap; }
.public-services-page .service-minimum { color: #10b83f; }
.public-services-page .service-maximum { color: #ed163e; }
.public-services-page .service-description-button {
  border: 0;
  border-radius: 999px;
  padding: 8px 14px;
  color: #fff;
  background: var(--public-red);
  font-weight: 800;
  cursor: pointer;
}
.public-services-page .service-description-row td { height: auto; padding: 18px 24px; color: #5c688c; background: #f6f7fb; line-height: 1.7; white-space: pre-wrap; }
.public-services-page .service-empty { height: 160px !important; text-align: center; }

@media (max-width: 1100px) {
  .public-services-header { grid-template-columns: 180px 1fr auto; gap: 28px; padding-right: 28px; padding-left: 28px; }
  .public-services-nav { gap: 30px; }
  .public-services-round { display: none; }
}

@media (max-width: 900px) {
  .public-services-header { grid-template-columns: 1fr auto; height: auto; min-height: 140px; gap: 18px; padding: 20px 18px 28px; }
  .public-services-brand { width: 120px; height: 62px; }
  .public-services-brand img { width: 120px; max-height: 60px; }
  .public-services-nav { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; }
  .public-services-login,
  .public-services-register { min-width: 86px; min-height: 42px; padding: 0 15px; }
  .public-services-main { padding: 16px 12px 48px; }
  .public-services-catalog { padding: 12px; border-radius: 14px; }
  .public-services-page .services-filter { grid-template-columns: minmax(0, 1fr) 44px; gap: 10px; }
  .public-services-page .service-category-dropdown { grid-column: 1 / -1; }
  .public-services-page .service-category-menu { width: 100%; }
}

@media (max-width: 560px) {
  .public-services-header { grid-template-columns: 1fr; }
  .public-services-actions { justify-content: flex-start; }
  .public-services-nav { grid-row: auto; }
  .public-services-page .sv-pill { flex-basis: 40px; width: 40px; height: 40px; }
}