:root {
  /* --primary-color: #263269; */
  --primary-color: #263269;
  /* --accent-color: #e8542a; */
  --accent-color: #e8542a;
  /* --highlight-color: #55c7cd; */
  --highlight-color: #55c7cd;
  /* --surface-color: #ffffff; */
  --surface-color: #ffffff;
  /* --text-color: #1e2d41; */
  --text-color: #1e2d41;
  /* --accent-hover-color: #d24324; */
  --accent-hover-color: #d24324;
  /* --primary-hover-color: #10174a; */
  --primary-hover-color: #10174a;
  /* --muted-surface-color: #e9e9f1; */
  --muted-surface-color: #e9e9f1;
  /* --tint-color: #ccebf0; */
  --tint-color: #ccebf0;
  /* --secondary-accent-color: #88d5dc; */
  --secondary-accent-color: #88d5dc;
  /* --footer-strip-color: #3b4579; */
  --footer-strip-color: #3b4579;
  /* --neutral-surface-color: #f2f2f2; */
  --neutral-surface-color: #f2f2f2;
  /* --accent-soft-color: #feebe9; */
  --accent-soft-color: #feebe9;
  /* --accent-soft-text-color: #d94926; */
  --accent-soft-text-color: #d94926;

  --theme-0: var(--primary-color);
  --theme-1: var(--accent-color);
  --theme-2: var(--highlight-color);
  --theme-3: var(--surface-color);
  --theme-4: var(--text-color);
  --theme-5: var(--accent-hover-color);
  --theme-6: var(--primary-hover-color);
  --theme-7: var(--muted-surface-color);
  --theme-8: var(--tint-color);
  --theme-9: var(--secondary-accent-color);
  --theme-10: var(--footer-strip-color);
  --theme-11: var(--neutral-surface-color);
  --theme-12: var(--accent-soft-color);
  --theme-13: var(--accent-soft-text-color);

  --theme-bg: #f7f2e8;
  --theme-surface: #fffaf3;
  --theme-surface-strong: #ffffff;
  --theme-ink: #233127;
  --theme-muted: #5f6f63;
  --theme-line: rgba(35, 49, 39, 0.12);
  --theme-accent: #b85c38;
  --theme-accent-strong: #934325;
  --theme-accent-soft: #f2dfd3;
  --theme-hero-start: #1f3a32;
  --theme-hero-end: #39594e;
  --theme-shadow: 0 18px 50px rgba(35, 49, 39, 0.12);
  --theme-radius-lg: 30px;
  --theme-radius-md: 22px;
  --theme-body-font: "Trebuchet MS", "Gill Sans", "Segoe UI", sans-serif;
  --theme-heading-font: "Georgia", "Palatino Linotype", serif;
}

html,
body {
  background:
    radial-gradient(
      circle at top left,
      rgba(184, 92, 56, 0.08),
      transparent 32%
    ),
    linear-gradient(180deg, var(--theme-surface) 0%, var(--theme-bg) 100%);
  color: var(--theme-ink);
}

body {
  font-family: var(--theme-body-font);
}

h1,
h2,
h3,
h4,
.heading-section__title,
.cms__title,
.valuation-flow-header h3,
.houses-price-header h3,
.experts-views h3,
.accordion-item-title {
  font-family: var(--theme-heading-font);
  letter-spacing: 0.01em;
}

.yp-navigation {
  background: rgba(255, 250, 243, 0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--theme-line);
  box-shadow: 0 10px 24px rgba(35, 49, 39, 0.06);
}

.yp-navigation .container,
.yp-footer .container,
.online-valuation-container .container,
.cms-page-container .container,
.yp-page-header .container {
  max-width: 1180px;
}

.yopa-logo,
.yp-footer__logo {
  filter: saturate(0.8) hue-rotate(-15deg);
}

.royal-blue-container {
  background:
    radial-gradient(
      circle at top right,
      rgba(242, 223, 211, 0.18),
      transparent 30%
    ),
    linear-gradient(135deg, var(--theme-hero-start), var(--theme-hero-end));
}

.online-valuation-container .text-white,
.online-valuation-container .heading-section__title,
.online-valuation-container .heading-section__paragraph {
  color: var(--theme-surface) !important;
}

.step-progress span {
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 999px;
  color: #fff;
}

.step-progress span.active {
  background: var(--theme-accent);
  border-color: var(--theme-accent);
  box-shadow: 0 8px 18px rgba(184, 92, 56, 0.28);
}

.valuation-flow-card,
.trustpilot-details-box--white,
.experts-views-box,
.accordion__item,
.cms-page-container section,
.disclaimers .container {
  border: 1px solid rgba(35, 49, 39, 0.08);
  border-radius: var(--theme-radius-lg);
  box-shadow: var(--theme-shadow);
}

.cms-page-container section,
.disclaimers .container {
  padding: 28px;
}

.select-address-container,
.review-container,
.expert-container,
.online-valuation-fqa-container,
.gray-bg.placeholder,
.online-valuation-reviews-container,
.cms-page-container {
  position: relative;
  z-index: 1;
}

.online-valuation-reviews-container,
.online-valuation-fqa-container,
.gray-bg.placeholder,
.cms-page-container,
.disclaimers {
  background: transparent;
}

.valuation-flow-card {
  border-radius: 34px;
}

.valuation-flow-card input,
.valuation-flow-card textarea {
  background: var(--theme-surface-strong);
  border: 1px solid rgba(35, 49, 39, 0.16);
}

.valuation-flow-card input:focus,
.valuation-flow-card textarea:focus {
  border-color: var(--theme-accent);
  box-shadow: 0 0 0 4px rgba(184, 92, 56, 0.12);
  outline: none;
}

.valuation-summary {
  background: var(--theme-accent-soft);
  color: var(--theme-ink);
}

.valuation-cta,
.site-modal-button,
.cc-btn.cc-dismiss {
  background: linear-gradient(
    135deg,
    var(--theme-accent),
    var(--theme-accent-strong)
  );
  box-shadow: 0 10px 20px rgba(184, 92, 56, 0.22);
  color: #fff;
}

.valuation-secondary {
  background: var(--theme-accent-soft);
  color: var(--theme-ink);
}

.link-white,
.link-underline,
.yp-footer a,
.cms-page-container a,
.yp-navigation a,
.select-address-dropdown--cant-find a {
  color: var(--theme-accent);
}

.online-valuation-image img {
  filter: sepia(0.28) hue-rotate(-18deg) saturate(0.8);
}

.trustpilot-box,
.trustpilot-banner {
  background: rgba(255, 250, 243, 0.82);
  border: 1px solid rgba(35, 49, 39, 0.08);
  border-radius: 20px;
  padding: 18px 22px;
}

.experts-views-box,
.trustpilot-details-box--white {
  overflow: hidden;
}

.expert-view-author .image img,
.answered-by .image img {
  border-radius: 20px;
  object-fit: cover;
}

.accordion__trigger {
  align-items: center;
  background: transparent;
  color: var(--theme-ink);
  padding: 22px 26px;
}

.accordion__content {
  padding: 0 26px 26px;
}

.accordion__item + .accordion__item {
  margin-top: 18px;
}

.yp-page-header {
  background:
    radial-gradient(circle at top, rgba(184, 92, 56, 0.12), transparent 36%),
    linear-gradient(180deg, var(--theme-surface), var(--theme-bg));
}

.cms-page-container {
  padding-bottom: 32px;
}

.yp-footer {
  background: #1e2e26;
  color: #e9dfd2;
  margin-top: 48px;
}

.yp-footer .footer-grid {
  gap: 24px;
}

.yp-footer a,
.yp-footer--contact span,
.yp-footer--address,
.yp-footer-foot p {
  color: #e9dfd2;
}

.yp-footer-foot {
  border-top: 1px solid rgba(233, 223, 210, 0.14);
}

.rounded-icon {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  padding: 10px;
}

.disclaimers {
  background: transparent;
}

.disclaimers .container {
  margin-top: 32px;
}

.site-modal-card {
  border-radius: 28px;
}

@media screen and (min-width: 992px) {
  .online-valuation-container .heading-container,
  .online-valuation-container .houses-price-header,
  .online-valuation-container .experts-views {
    margin-bottom: 22px;
  }

  .review-container {
    display: block;
  }

  .review-container > div,
  .review-container .simple-slider-track > div,
  .review-container .simple-slider-track > div > .col-sm-6,
  .expert-view-container .row > .col-sm-12 {
    width: 100%;
    max-width: 100%;
  }
}

@media screen and (max-width: 991px) {
  .cms-page-container section,
  .disclaimers .container,
  .valuation-flow-card,
  .trustpilot-details-box--white,
  .experts-views-box,
  .accordion__item {
    border-radius: 24px;
  }
}

@media screen and (max-width: 767px) {
  .yp-navigation {
    backdrop-filter: none;
  }

  .cms-page-container section,
  .disclaimers .container {
    padding: 20px;
  }

  .trustpilot-box,
  .trustpilot-banner {
    padding: 14px 16px;
  }

  .accordion__trigger {
    padding: 18px 18px 12px;
  }

  .accordion__content {
    padding: 0 18px 18px;
  }

  .yp-footer {
    margin-top: 32px;
  }
}
