.servat-recommender {
  --servat-primary: #0f766e;
  --servat-primary-dark: #0b5f59;
  --servat-accent: #d97706;
  --servat-ink: #172126;
  --servat-muted: #687874;
  --servat-line: #dce7e4;
  --servat-soft: #f4faf8;
  color: var(--servat-ink);
  background: #fff;
  border: 1px solid var(--servat-line);
  border-radius: 8px;
  overflow: hidden;
  max-width: 920px;
  margin: 24px auto;
  font-family: Tahoma, Arial, sans-serif;
  font-size: var(--servat-front-font-size, 16px);
  box-shadow: 0 18px 48px rgba(23, 33, 38, .08);
}
.servat-recommender h2,
.servat-recommender h3,
.servat-recommender p {
  margin-top: 0;
}
.servat-step {
  display: none;
}
.servat-step.is-active {
  display: block;
}
.servat-hero {
  min-height: 320px;
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 12px;
  padding: 44px;
  color: #fff;
  background:
    linear-gradient(135deg, rgba(8, 63, 59, .96), rgba(15, 118, 110, .84)),
    repeating-linear-gradient(45deg, rgba(255,255,255,.08) 0 1px, transparent 1px 18px);
}
.servat-kicker,
.servat-form-head span {
  color: #9df0e4;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}
.servat-hero h2 {
  color: #fff;
  font-size: 32px;
  line-height: 1.7;
}
.servat-hero p {
  max-width: 620px;
  color: #e4fffa;
  font-size: 15px;
  line-height: 2;
}
.servat-form-head,
.servat-step-results,
.servat-step-loading,
.servat-step-questions {
  padding: 28px;
}
.servat-form-head {
  padding: 0 0 12px;
  border-bottom: 1px solid var(--servat-line);
}
.servat-form-head h2,
.servat-step-results h2 {
  font-size: 24px;
  line-height: 1.6;
}
.servat-question {
  position: relative;
  border-bottom: 1px solid var(--servat-line);
  padding: 24px 0 24px 54px;
}
.servat-question-number {
  position: absolute;
  left: 0;
  top: 24px;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #e4f6f2;
  color: var(--servat-primary);
  font-weight: 900;
}
.servat-question h3 {
  font-size: 18px;
  line-height: 1.7;
}
.servat-question p {
  color: var(--servat-muted);
}
.servat-question.has-error {
  background: #fff7ed;
  outline: 1px solid #fed7aa;
  outline-offset: 10px;
}
.servat-question.has-error::after {
  content: "پاسخ به این سوال اجباری است.";
  display: block;
  color: #b45309;
  font-size: 12px;
  font-weight: 800;
  margin-top: 10px;
}
.servat-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.servat-options label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--servat-line);
  border-radius: 8px;
  background: var(--servat-soft);
  padding: 11px 14px;
  cursor: pointer;
  transition: .18s ease;
}
.servat-options label:hover,
.servat-options label.is-selected {
  border-color: var(--servat-primary);
  background: #e6f8f5;
  box-shadow: 0 8px 22px rgba(15, 118, 110, .12);
}
.servat-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: var(--servat-primary);
  color: #fff;
  border-radius: 6px;
  padding: 13px 22px;
  cursor: pointer;
  font-weight: 700;
  transition: .18s ease;
}
.servat-button:hover {
  background: var(--servat-primary-dark);
  color: #fff;
  transform: translateY(-1px);
}
.servat-submit {
  margin-top: 22px;
}
.servat-loader {
  width: 42px;
  height: 42px;
  border: 4px solid #dce5e2;
  border-top-color: var(--servat-primary);
  border-radius: 50%;
  animation: servat-spin 1s linear infinite;
}
.servat-result {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  border: 1px solid var(--servat-line);
  border-radius: 8px;
  padding: 14px;
  margin: 12px 0;
  background: #fbfdfd;
}
.servat-result-image {
  width: 96px;
  height: 76px;
  border-radius: 8px;
  background: linear-gradient(135deg, #e4f6f2, #f8fafc);
  overflow: hidden;
}
.servat-result-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.servat-result h3 {
  margin: 0 0 10px;
  font-size: 18px;
}
.servat-result-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.servat-result-metrics span {
  display: inline-flex;
  border-radius: 999px;
  background: var(--servat-soft);
  color: var(--servat-primary);
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 800;
}
.servat-result-action {
  justify-self: end;
}
.servat-result a,
.servat-detail-button {
  font-weight: 800;
  text-decoration: none;
}
.servat-detail-button {
  border: 0;
  cursor: pointer;
  font-family: inherit;
}
.servat-result .servat-pay-link {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  border-radius: 6px;
  background: var(--servat-primary);
  color: #fff;
  padding: 0 14px;
}
.servat-empty {
  border: 1px dashed var(--servat-line);
  border-radius: 8px;
  background: var(--servat-soft);
  padding: 18px;
  color: var(--servat-muted);
}
.servat-result-notice {
  border: 1px solid #fed7aa;
  border-radius: 8px;
  background: #fff7ed;
  color: #b45309;
  padding: 14px;
  font-weight: 800;
  line-height: 1.9;
}
.servat-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: none;
  place-items: center;
  padding: 20px;
}
.servat-modal.is-open {
  display: grid;
}
.servat-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, .58);
}
.servat-modal-panel {
  position: relative;
  z-index: 1;
  width: min(440px, 100%);
  border-radius: 8px;
  background: #fff;
  padding: 24px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .25);
}
.servat-modal-panel h3 {
  font-size: 22px;
  line-height: 1.7;
  margin: 4px 0 8px;
}
.servat-modal-panel .servat-kicker {
  color: var(--servat-primary);
}
.servat-modal-close {
  position: absolute;
  top: 12px;
  left: 12px;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: #eef5f3;
  color: var(--servat-ink);
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}
.servat-price-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid var(--servat-line);
  border-radius: 8px;
  background: var(--servat-soft);
  padding: 14px;
  margin: 18px 0;
}
.servat-price-box span {
  color: var(--servat-muted);
}
.servat-price-box strong {
  color: var(--servat-primary);
  font-size: 20px;
}
.servat-price-values {
  display: grid;
  gap: 6px;
  justify-items: end;
}
.servat-price-values del {
  position: relative;
  color: #dc2626;
  font-weight: 900;
  text-decoration: none;
}
.servat-price-values del::after {
  content: "";
  position: absolute;
  left: -4px;
  right: -4px;
  top: 50%;
  height: 2px;
  background: #dc2626;
  transform: rotate(-12deg);
}
.servat-modal-pay {
  width: 100%;
  text-align: center;
  text-decoration: none;
}
@keyframes servat-spin {
  to { transform: rotate(360deg); }
}
@media (max-width: 640px) {
  .servat-recommender {
    font-size: var(--servat-front-mobile-font-size, 15px);
  }
  .servat-hero,
  .servat-form-head,
  .servat-step-results,
  .servat-step-loading,
  .servat-step-questions {
    padding: 22px;
  }
  .servat-hero h2 {
    font-size: 25px;
  }
  .servat-question {
    padding-left: 0;
    padding-top: 62px;
  }
  .servat-question-number {
    left: auto;
    right: 0;
  }
  .servat-options {
    display: grid;
  }
  .servat-result {
    grid-template-columns: 76px minmax(0, 1fr);
  }
  .servat-result-image {
    width: 76px;
    height: 66px;
  }
  .servat-result-action {
    grid-column: 1 / -1;
    justify-self: stretch;
  }
  .servat-result-action .servat-button {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}

.servat-business-page {
  --servat-primary: #0f766e;
  --servat-primary-dark: #0b5f59;
  --servat-accent: #d97706;
  --servat-ink: #172126;
  --servat-muted: #687874;
  --servat-line: #dce7e4;
  --servat-soft: #f4faf8;
  width: min(1180px, calc(100% - 32px));
  margin: 32px auto;
  color: var(--servat-ink);
  font-family: Tahoma, Arial, sans-serif;
}
.servat-business-page h1,
.servat-business-page h2,
.servat-business-page h3,
.servat-business-page p {
  margin-top: 0;
}
.servat-business-hero {
  display: grid;
  grid-template-columns: minmax(280px, 44%) minmax(0, 1fr);
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--servat-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 20px 60px rgba(23, 33, 38, .08);
}
.servat-business-hero-media {
  min-height: 380px;
  background: #e7f4f1;
}
.servat-business-hero-media img,
.servat-business-gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.servat-business-image-placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  min-height: 380px;
  background: linear-gradient(135deg, #0f766e, #d97706);
  color: #fff;
  font-size: 84px;
  font-weight: 900;
}
.servat-business-hero-content {
  display: grid;
  align-content: center;
  gap: 16px;
  padding: 42px;
}
.servat-business-hero-content .servat-kicker {
  color: var(--servat-primary);
}
.servat-business-hero-content h1 {
  font-size: 38px;
  line-height: 1.55;
}
.servat-business-hero-content p {
  color: var(--servat-muted);
  font-size: 16px;
  line-height: 2;
}
.servat-business-quick {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.servat-detail-chip {
  border: 1px solid var(--servat-line);
  border-radius: 8px;
  background: var(--servat-soft);
  padding: 12px;
}
.servat-detail-chip span,
.servat-tax-card strong,
.servat-price-box span {
  display: block;
  color: var(--servat-muted);
  font-size: 12px;
  font-weight: 800;
}
.servat-detail-chip strong {
  display: block;
  margin-top: 6px;
  color: var(--servat-ink);
}
.servat-business-content-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
  margin-top: 18px;
}
.servat-business-article,
.servat-business-card,
.servat-business-section,
.servat-info-card,
.servat-tax-card {
  border: 1px solid var(--servat-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 34px rgba(23, 33, 38, .05);
}
.servat-business-article,
.servat-business-card,
.servat-business-section {
  padding: 24px;
}
.servat-business-article h2,
.servat-business-card h2,
.servat-business-section h2 {
  font-size: 22px;
  line-height: 1.7;
}
.servat-business-editor-content {
  color: #273a35;
  font-size: 16px;
  line-height: 2.15;
}
.servat-business-editor-content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}
.servat-boolean-grid {
  display: grid;
  gap: 10px;
}
.servat-boolean-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-radius: 8px;
  padding: 12px;
  background: #f8fafc;
}
.servat-boolean-item.is-yes strong {
  color: var(--servat-primary);
}
.servat-boolean-item.is-no strong {
  color: #be123c;
}
.servat-online-note {
  border-top: 1px solid var(--servat-line);
  margin-top: 14px;
  padding-top: 14px;
}
.servat-online-note strong {
  color: var(--servat-primary);
}
.servat-online-note p {
  color: var(--servat-muted);
  line-height: 1.9;
  margin: 8px 0 0;
}
.servat-business-section {
  margin-top: 18px;
}
.servat-detail-grid,
.servat-tax-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.servat-info-card,
.servat-tax-card {
  padding: 16px;
  box-shadow: none;
}
.servat-info-card h3 {
  color: var(--servat-primary);
  font-size: 15px;
  line-height: 1.7;
}
.servat-info-card p,
.servat-tax-card span {
  color: var(--servat-muted);
  line-height: 1.9;
}
.servat-business-gallery {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.servat-business-gallery img {
  aspect-ratio: 4 / 3;
  border-radius: 8px;
}
@media (max-width: 1024px) {
  .servat-business-hero,
  .servat-business-content-wrap {
    grid-template-columns: 1fr;
  }
  .servat-business-hero-media,
  .servat-business-image-placeholder {
    min-height: 320px;
  }
  .servat-detail-grid,
  .servat-tax-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .servat-business-page {
    width: min(100% - 20px, 1180px);
    margin: 16px auto;
  }
  .servat-business-hero-content,
  .servat-business-article,
  .servat-business-card,
  .servat-business-section {
    padding: 18px;
  }
  .servat-business-hero-content h1 {
    font-size: 28px;
  }
  .servat-business-quick,
  .servat-detail-grid,
  .servat-tax-grid,
  .servat-business-gallery {
    grid-template-columns: 1fr;
  }
}