@font-face {
  font-family: "Electric Grotesk";
  src: url("../fonts/homepage/familjengrotesk-regular.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Electric Grotesk";
  src: url("../fonts/homepage/familjengrotesk-semibold.woff2") format("woff2");
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Electric Grotesk";
  src: url("../fonts/homepage/familjengrotesk-bold.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Electric Serif";
  src: url("../fonts/homepage/instrument-serif-italic.woff") format("woff");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

body.wr-theme-upgraded {
  --wr-ink: #211333;
  --wr-copy: #51475f;
  --wr-purple: #7f07ff;
  --wr-purple-deep: #5d00bf;
  --wr-lilac: #e4dafa;
  --wr-lilac-soft: #f5f0ff;
  --wr-peach: #ffeadb;
  --wr-paper: #ffffff;
  --wr-line: #dcd3e8;
  --wr-shadow: 0 24px 70px rgba(52, 24, 78, 0.1);
  color: var(--wr-copy);
  background: var(--wr-paper);
  font-family: "Electric Grotesk", Arial, sans-serif;
}

.wr-theme-upgraded :is(h1, h2, h3, h4, h5, h6, button, input, select, textarea) {
  font-family: "Electric Grotesk", Arial, sans-serif;
}

.wr-theme-upgraded :is(h1, h2, h3, h4) {
  color: var(--wr-ink);
  text-wrap: balance;
}

.wr-theme-upgraded :is(h1, h2) {
  letter-spacing: -0.055em;
}

.wr-theme-upgraded :is(p, li) {
  text-wrap: pretty;
}

.wr-theme-upgraded :is(.eyebrow, .wr-label, [class*="kicker"]),
.wr-theme-upgraded :is(.wr-city-hero, .wr-market-page, .faq-hero, .wr-checkup-hero, .wr-policy-hero, .wr-blog-hero, .planner-table-hero, .article-hero) small:first-child {
  color: var(--wr-purple-deep);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-size: 0.76rem;
  font-weight: 700;
}

.wr-theme-upgraded :is(.button, .rev-button):not(.white) {
  border: 1px solid var(--wr-purple);
  border-radius: 9px;
  color: #fff;
  background: var(--wr-purple);
  box-shadow: 0 12px 28px rgba(127, 7, 255, 0.22);
}

.wr-theme-upgraded :is(.button, .rev-button):not(.white):hover {
  border-color: var(--wr-purple-deep);
  background: var(--wr-purple-deep);
  transform: translateY(-2px);
}

.wr-theme-upgraded :is(.line-link, a:not([class])) {
  text-underline-offset: 0.2em;
  text-decoration-thickness: 1px;
}

/* Location and regional pages */
.wr-theme-upgraded .wr-city-page,
.wr-theme-upgraded .wr-market-page {
  --city-accent: var(--wr-purple-deep);
  --city-soft: var(--wr-lilac-soft);
  color: var(--wr-copy);
  background: var(--wr-paper);
}

.wr-theme-upgraded :is(.wr-city-hero, .wr-market-hero, .wr-market-page--hub > section:first-child) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 0;
  border-bottom: 1px solid #cec1e6;
  background:
    linear-gradient(90deg, rgba(106, 59, 156, 0.08) 1px, transparent 1px) 50% 0 / 25% 100%,
    linear-gradient(rgba(106, 59, 156, 0.08) 1px, transparent 1px) 0 / 100% 25%,
    var(--wr-lilac);
  padding-block: clamp(5.25rem, 9vw, 8.75rem);
}

.wr-theme-upgraded :is(.wr-city-hero, .wr-market-hero, .wr-market-page--hub > section:first-child)::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: clamp(-8rem, -5vw, -3rem);
  bottom: clamp(-11rem, -12vw, -6rem);
  width: clamp(17rem, 34vw, 34rem);
  aspect-ratio: 1;
  border: clamp(2.5rem, 6vw, 6rem) solid rgba(127, 7, 255, 0.1);
  border-radius: 50%;
}

.wr-theme-upgraded :is(.wr-city-hero, .wr-market-hero) h1,
.wr-theme-upgraded .wr-market-page--hub > section:first-child h1 {
  color: var(--wr-ink);
  max-width: 15ch;
  font-size: clamp(3.4rem, 7vw, 7rem);
  line-height: 0.93;
}

.wr-theme-upgraded :is(.wr-city-hero, .wr-market-hero) p,
.wr-theme-upgraded :is(.wr-city-hero, .wr-market-hero) span,
.wr-theme-upgraded .wr-market-page--hub > section:first-child p {
  color: var(--wr-copy);
}

.wr-theme-upgraded :is(.wr-city-section, [class*="wr-market-section"], .wr-city-final, .wr-market-final) {
  border-color: var(--wr-line);
  padding-block: clamp(4.75rem, 8vw, 8rem);
}

.wr-theme-upgraded :is(.wr-city-section--coverage, .wr-city-section--market-focus, .wr-market-section--soft) {
  background: var(--wr-lilac-soft);
}

.wr-theme-upgraded :is(.wr-city-section--process, .wr-city-section--pricing, .wr-market-final) {
  background: var(--wr-peach);
}

.wr-theme-upgraded :is(.wr-city-page, .wr-market-page) :is(article, details, [class*="card"], [class*="item"]) {
  border-color: var(--wr-line);
}

.wr-theme-upgraded :is(.wr-city-page, .wr-market-page) article {
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 14px 42px rgba(52, 24, 78, 0.07);
}

.wr-theme-upgraded :is(.wr-city-final, .wr-market-final) {
  color: var(--wr-ink);
  background: var(--wr-peach);
}

/* FAQ and website-checkup pages */
.wr-theme-upgraded :is(.faq-page, .wr-checkup-page) {
  --support-ink: var(--wr-ink);
  --support-copy: var(--wr-copy);
  --support-violet: var(--wr-purple);
  --support-violet-dark: var(--wr-purple-deep);
  --support-line: var(--wr-line);
  --support-paper: var(--wr-peach);
}

.wr-theme-upgraded :is(.faq-hero, .wr-checkup-hero) {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid #ead2c2;
  background: var(--wr-peach);
  padding-block: clamp(5.25rem, 9vw, 8.75rem);
}

.wr-theme-upgraded :is(.faq-hero, .wr-checkup-hero)::before {
  content: "";
  position: absolute;
  top: -9rem;
  right: -5rem;
  width: 24rem;
  aspect-ratio: 1;
  border: 4.5rem solid rgba(127, 7, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

.wr-theme-upgraded :is(.faq-hero h1, .wr-checkup-hero h1) {
  color: var(--wr-ink);
  max-width: 13ch;
  font-size: clamp(3.4rem, 7vw, 6.6rem);
  line-height: 0.93;
}

.wr-theme-upgraded :is(.faq-filter, .faq-question, .faq-path-grid > *, .faq-popular-grid > *, .wr-checkup-panel, .wr-checkup-page article) {
  border: 1px solid var(--wr-line);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 14px 42px rgba(52, 24, 78, 0.07);
}

.wr-theme-upgraded :is(.faq-center, .faq-paths, .faq-popular, .faq-truth, .faq-next, .wr-checkup-page > section) {
  padding-block: clamp(4.75rem, 8vw, 8rem);
}

.wr-theme-upgraded :is(.faq-paths, .faq-next, .wr-checkup-page > section:nth-of-type(even)) {
  background: var(--wr-lilac-soft);
}

.wr-theme-upgraded :is(.faq-center h2, .faq-paths h2, .faq-popular h2, .faq-truth h2, .faq-next h2, .wr-checkup-page h2) {
  color: var(--wr-ink);
  font-size: clamp(2.75rem, 5vw, 5rem);
  line-height: 0.98;
}

/* Blog index and articles */
.wr-theme-upgraded :is(.wr-blog-hero, .article-hero) {
  position: relative;
  overflow: hidden;
  max-width: none;
  border-bottom: 1px solid #cec1e6;
  background:
    linear-gradient(90deg, rgba(106, 59, 156, 0.08) 1px, transparent 1px) 50% 0 / 25% 100%,
    linear-gradient(rgba(106, 59, 156, 0.08) 1px, transparent 1px) 0 / 100% 25%,
    var(--wr-lilac);
  padding-block: clamp(5.25rem, 9vw, 8.75rem);
}

.wr-theme-upgraded :is(.wr-blog-hero, .article-hero) h1 {
  color: var(--wr-ink);
  max-width: 15ch;
  font-size: clamp(3.4rem, 7vw, 6.75rem);
  line-height: 0.94;
}

.wr-theme-upgraded .article-hero > p:not(.eyebrow) {
  color: var(--wr-copy);
}

.wr-theme-upgraded :is(.wr-blog-list, .wr-blog-method, .article-layout, .article-recommendations, .blog-cta) {
  padding-block: clamp(4.75rem, 8vw, 8rem);
}

.wr-theme-upgraded :is(.wr-blog-method, .article-recommendations, .blog-cta) {
  background: var(--wr-peach);
}

.wr-theme-upgraded :is(.wr-blog-list article, .article-sidebar, .article-callout, .article-plan-card, .recommendation-card, .article-comparison-wrap, .article-diagram) {
  border: 1px solid var(--wr-line);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 14px 42px rgba(52, 24, 78, 0.07);
}

.wr-theme-upgraded .article-body :is(h2, h3) {
  color: var(--wr-ink);
  letter-spacing: -0.04em;
}

.wr-theme-upgraded .article-body h2 {
  font-size: clamp(2.35rem, 4.5vw, 4.3rem);
  line-height: 1;
}

/* Planner */
.wr-theme-upgraded .wr-planner-page {
  --planner-ink: var(--wr-ink);
  --planner-copy: var(--wr-copy);
  --planner-violet: var(--wr-purple);
  --planner-line: var(--wr-line);
}

.wr-theme-upgraded .planner-table-hero {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid #ead2c2;
  background: var(--wr-peach);
  padding-block: clamp(5.25rem, 9vw, 8.75rem);
}

.wr-theme-upgraded .planner-table-hero h1 {
  color: var(--wr-ink);
  max-width: 14ch;
  font-size: clamp(3.4rem, 7vw, 6.75rem);
  line-height: 0.94;
}

.wr-theme-upgraded :is(.planner-table-form, .planner-table-output, .planner-guide-ledger, .planner-choice, .planner-doubt-answer, .planner-page-faq details) {
  border: 1px solid var(--wr-line);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 14px 42px rgba(52, 24, 78, 0.07);
}

.wr-theme-upgraded :is(.planner-table, .planner-table-guide, .planner-doubt, .planner-page-faq) {
  padding-block: clamp(4.75rem, 8vw, 8rem);
}

.wr-theme-upgraded :is(.planner-table-guide, .planner-doubt) {
  background: var(--wr-lilac-soft);
}

/* Policies */
.wr-theme-upgraded .wr-policy {
  --policy-lime: #caa7ff;
  color: var(--wr-copy);
  background: #fff;
}

.wr-theme-upgraded .wr-policy-hero {
  color: #fff;
  background:
    radial-gradient(circle at 82% 18%, rgba(127, 7, 255, 0.42), transparent 30%),
    var(--wr-ink);
}

.wr-theme-upgraded .wr-policy-hero > .shell {
  padding-block: clamp(5.25rem, 9vw, 8.75rem);
}

.wr-theme-upgraded .wr-policy-hero h1 {
  color: #fff;
  font-family: "Electric Grotesk", Arial, sans-serif;
  font-size: clamp(3.4rem, 7vw, 6.75rem);
  line-height: 0.94;
}

.wr-theme-upgraded .wr-policy-hero__aside {
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(14px);
}

.wr-theme-upgraded .wr-policy-layout {
  padding-block: clamp(4.75rem, 8vw, 8rem);
}

.wr-theme-upgraded .wr-policy-layout section {
  border: 1px solid var(--wr-line);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 12px 36px rgba(52, 24, 78, 0.06);
}

.wr-theme-upgraded .wr-policy-layout h2 {
  color: var(--wr-ink);
  font-size: clamp(2.2rem, 4vw, 3.75rem);
  line-height: 1;
}

/* Shared finish and responsive behavior */
.wr-theme-upgraded :is(.wr-city-page, .wr-market-page, .faq-page, .wr-checkup-page, .wr-planner-page, .blog-article-page, .wr-policy) img {
  border-radius: 18px;
}

.wr-theme-upgraded :is(.wr-city-page, .wr-market-page, .faq-page, .wr-checkup-page, .wr-planner-page, .blog-article-page, .wr-policy) :focus-visible {
  outline: 3px solid rgba(127, 7, 255, 0.55);
  outline-offset: 3px;
}

@media (max-width: 820px) {
  .wr-theme-upgraded :is(.wr-city-hero, .wr-market-hero, .faq-hero, .wr-checkup-hero, .planner-table-hero, .article-hero) {
    padding-block: 4.35rem 5.25rem;
  }

  .wr-theme-upgraded :is(.wr-city-hero, .wr-market-hero, .faq-hero, .wr-checkup-hero, .planner-table-hero, .article-hero) h1,
  .wr-theme-upgraded .wr-policy-hero h1 {
    font-size: clamp(2.9rem, 13vw, 4.3rem);
    line-height: 0.96;
  }

  .wr-theme-upgraded :is(.wr-city-page, .wr-market-page) article,
  .wr-theme-upgraded :is(.faq-filter, .faq-question, .wr-checkup-panel, .planner-table-form, .planner-table-output),
  .wr-theme-upgraded .wr-policy-layout section {
    border-radius: 17px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wr-theme-upgraded *,
  .wr-theme-upgraded *::before,
  .wr-theme-upgraded *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}