/**
 * Contact & Pricing page sections (Onereach main blocks):
 *   Hero (contact form)  .sol-hero.sol-hero--pricing(.sol-hero--contact) (+ HubSpot form .hs-embed)
 *   Link cards           .figures.contact-links (style 1) / .verdicts (style 2)
 *   Analysts             .analysts--divided
 *   CTA (style 3)        .together--flush.together--split
 *   Included (bento)     .includes .bento
 *   Testimonials, with a portrait   .quote--person / .quote--single
 * Ported from pages/assets/main.css (the static prototypes, pages/contact.html and pages/pricing.html).
 * Loaded after home.css by template-or-blocks.php.
 */

.sol-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 1fr auto;
  align-items: center;
  row-gap: 64px;
  min-height: clamp(640px, 100svh, 860px);
  padding: 80px 0 32px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: radial-gradient(
      55% 70% at 85% 35%,
      rgba(105, 132, 228, 0.16),
      transparent 70%
    ),
    radial-gradient(
      45% 60% at 0% 100%,
      rgba(134, 116, 85, 0.22),
      transparent 70%
    ),
    #0f0f0f;
}
.sol-hero__inner {
  width: min(100% - clamp(32px, 6.25vw, 48px), 1312px);
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0, 640px) minmax(360px, 440px);
  justify-content: center;
  gap: 80px;
  align-items: center;
}
.sol-hero__title {
  font-weight: 500;
  font-size: clamp(3rem, 6.4vw, 5rem);
  line-height: 1;
}
.sol-hero__text {
  margin-top: 24px;
  color: #dfd5c4;
}
@media (min-width: 1025px) {
  .sol-hero__text {
    max-width: 520px;
  }
}
.sol-hero__aside {
  position: relative;
}
.sol-hero__neb {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 760px;
  aspect-ratio: 1;
  transform: translate(-50.34%, -48.34%);
  opacity: 0.55;
  pointer-events: none;
  -webkit-mask-image: radial-gradient(closest-side, #000 55%, transparent);
  mask-image: radial-gradient(closest-side, #000 55%, transparent);
}
.sol-hero__neb img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.sol-hero__logos {
  position: relative;
}
.sol-hero__logos .marquee--logos {
  padding-top: 32px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.sol-hero__form {
  position: relative;
  padding: 32px;
  border: 1px solid rgba(240, 240, 250, 0.12);
  border-radius: 24px;
  background: linear-gradient(#526ccc1c, #526ccc1c), #131314;
  box-shadow: 0 30px 80px #00000073;
}
.sol-hero__form > h2 {
  text-align: center;
}
.sol-hero__form .hs-embed {
  margin-top: 24px;
}
@media (max-width: 1024px) {
  .sol-hero {
    min-height: auto;
    row-gap: 48px;
    padding: 64px 0 32px;
  }
  .sol-hero__inner {
    grid-template-columns: 1fr;
    gap: 48px;
  }
  .sol-hero__neb {
    width: 140%;
    opacity: 0.4;
  }
}
@media (max-width: 768px) {
  .sol-hero__form {
    padding: 24px 20px;
  }
}
.hs-embed__fallback {
  color: #646464;
  font-size: 0.875rem;
}
.hs-embed__fallback a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.hs-embed form {
  display: grid;
  gap: 16px;
}
.hs-embed .hs-form-field label:not(.hs-error-msg) {
  display: block;
  margin-bottom: 6px;
  color: #dfd5c4;
  font-weight: 300;
  font-size: 0.875rem;
}
.hs-embed .hs-form-required {
  margin-left: 2px;
  color: #4bb9b5;
}
.hs-embed .hs-input:not([type="checkbox"]):not([type="radio"]) {
  width: 100%;
  min-height: 48px !important;
  padding: 0 16px !important;
  border: 1px solid rgba(240, 240, 250, 0.12);
  border-radius: 8px;
  background: #ffffff0a;
  color: #fff;
  font: inherit;
  font-weight: 300;
  transition:
    border-color 0.2s ease,
    background 0.2s ease;
}
.hs-embed .hs-input:not([type="checkbox"]):not([type="radio"]):hover {
  border-color: #f0f0fa3d;
}
.hs-embed .hs-input:not([type="checkbox"]):not([type="radio"]):focus {
  outline: none;
  border-color: #526ccc;
  background: #526ccc1a;
  box-shadow: 0 0 0 3px #526ccc40;
}
.hs-embed .hs-input:not([type="checkbox"]):not([type="radio"]).invalid,
.hs-embed .hs-input:not([type="checkbox"]):not([type="radio"]).error {
  border-color: #e35242;
}
.hs-embed .hs-input:not([type="checkbox"]):not([type="radio"]):is(textarea) {
  min-height: 112px !important;
  padding-block: 12px !important;
  resize: vertical;
}
.hs-embed .hs-error-msgs {
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
  color: #e97568;
  font-size: 0.8125rem;
}
.hs-embed .hs-richtext,
.hs-embed .legal-consent-container {
  color: #646464;
  font-size: 0.75rem;
  line-height: 1.5;
}
.hs-embed .hs-richtext a,
.hs-embed .legal-consent-container a {
  color: #dfd5c4;
  text-decoration: underline;
}
.hs-embed .hs_submit {
  margin-top: 8px;
}
.hs-embed .hs-button {
  width: 100%;
  min-height: 48px;
  padding: 0 24px;
  border: 0;
  border-radius: 8px;
  background: #526ccc;
  color: #fff;
  font: inherit;
  font-weight: 500;
  font-size: 1.125rem;
  cursor: pointer;
  transition:
    transform 0.2s ease,
    background 0.2s ease;
}
.hs-embed .hs-button:hover {
  transform: translateY(-1px);
  background: #6a7fcb;
}
.hs-embed .hs-button:focus-visible {
  outline: 2px solid #526ccc;
  outline-offset: 3px;
}
.hs-embed .submitted-message {
  color: #dfd5c4;
}
.spotlight__points {
  display: grid;
  gap: 12px;
  margin: 32px 0 0;
  padding: 0;
  list-style: none;
}
.spotlight__points li {
  position: relative;
  padding-left: 32px;
  color: #fff;
  font-weight: 300;
}
.spotlight__points li:before {
  content: "";
  position: absolute;
  top: 0.15em;
  left: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.5l2.5 2.5L14 7.5' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
      center/20px no-repeat,
    #526ccc;
}
.spotlight__points--body li {
  color: #dfd5c4;
  font-weight: 200;
  font-size: 1.25rem;
  line-height: 1.4;
}
.spotlight__points--body li:before {
  top: 0.2em;
}
.quote--single .quote__slides {
  padding-right: 0;
}
.sol-hero--pricing {
  grid-template-rows: 1fr;
  background: radial-gradient(
      55% 70% at 85% 35%,
      rgba(105, 132, 228, 0.16),
      transparent 70%
    ),
    #0f0f0f;
  padding-bottom: 80px;
}
@media (max-width: 1024px) {
  .sol-hero--pricing {
    padding-bottom: 64px;
  }
}
.sol-hero--pricing .sol-hero__form {
  background: #0f0f0fb8;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: none;
}
.sol-hero--pricing .sol-hero__form > h2 {
  margin-bottom: 20px;
  color: #fff;
  font-weight: 500;
  font-size: 1.75rem;
  line-height: 1.2;
  text-align: left;
}
.sol-hero--pricing .sol-hero__form .hs-embed {
  margin-top: 0;
}
.sol-hero--pricing .sol-hero__title {
  font-size: clamp(2.75rem, 4.4vw, 4rem);
}
.sol-hero__sub {
  display: block;
  margin-top: 16px;
  color: #dfd5c4;
  font-weight: 300;
  font-size: 0.6em;
}
.quote__source {
  display: block;
  max-width: 560px;
  margin-top: 8px;
  color: #a7a7a7;
  font-size: 0.875rem;
  line-height: 1.4;
}
.figures {
  border-block: 1px solid rgba(255, 255, 255, 0.08);
  background: radial-gradient(
      50% 60% at 50% 100%,
      rgba(82, 108, 204, 0.14),
      transparent 70%
    ),
    #131314;
}
.figures__inner {
  width: min(100% - clamp(32px, 6.25vw, 48px), 1312px);
  margin-inline: auto;
}
.figures__list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 1024px) {
  .figures__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .figures__list {
    grid-template-columns: 1fr;
  }
}
.figure-card {
  display: flex;
  flex-direction: column;
  padding: 32px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 16px;
  background: linear-gradient(180deg, #1a1a1a, #1a1a1a00), #191a22;
  transition: border-color 0.3s ease;
}
.figure-card:hover {
  border-color: #ffffff3d;
}
.figure-card__art {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  margin-bottom: 24px;
}
.figure-card__icon {
  display: block;
  width: 48px;
  height: 48px;
  max-width: none;
  object-fit: contain;
  overflow: visible;
}
.figure-card__label {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(240, 240, 250, 0.12);
  color: #dfd5c4;
  font-weight: 500;
  font-size: 1.25rem;
  line-height: 1.3;
}
.figure-card__text {
  margin-top: 4px;
  color: #dfd5c4;
}
.quote--person .quote__inner {
  display: grid;
  grid-template-columns: minmax(0, 280px) minmax(0, 1fr);
  gap: 64px;
  align-items: center;
  max-width: 1120px;
}
.quote--person .quote__portrait {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid rgba(240, 240, 250, 0.12);
  border-radius: 24px;
}
@media (max-width: 768px) {
  .quote--person .quote__inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .quote--person .quote__portrait {
    max-width: 200px;
  }
}
.sol-hero--contact {
  grid-template-rows: 1fr auto;
  padding-bottom: 32px;
}
.sol-hero--contact .sol-hero__copy .spotlight__points {
  margin-top: 24px;
}
.sol-hero--contact .sol-hero__copy .spotlight__points + .sol-hero__text {
  margin-top: 24px;
}
@media (min-width: 1025px) {
  .sol-hero--contact .sol-hero__inner {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 560px);
    justify-content: stretch;
  }
  .sol-hero--contact .sol-hero__text {
    max-width: none;
  }
}
.contact-links__list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 1024px) {
  .contact-links__list {
    grid-template-columns: 1fr;
  }
}
.contact-links .figure-card__label {
  margin-top: 0;
}
.contact-links.is-armed:not(.is-in) .figure-card {
  opacity: 0;
}
.contact-links.is-armed.is-in .figure-card {
  animation: inview-rise 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.contact-links.is-armed.is-in .figure-card:nth-child(2) {
  animation-delay: 0.12s;
}
.contact-links.is-armed.is-in .figure-card:nth-child(3) {
  animation-delay: 0.24s;
}
.contact-links__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  padding-top: 24px;
  color: #dfd5c4;
  font-weight: 400;
}
.contact-links__link svg {
  transition: transform 0.2s ease;
}
.contact-links__link:hover svg {
  transform: translate(4px);
}
.contact-links__link:focus-visible {
  outline: 2px solid #526ccc;
  outline-offset: 3px;
}


/* Testimonials with a portrait and several quotes: the dots sit beside the quote, not the portrait. */
.quote--person .quote__main {
  position: relative;
  min-width: 0;
}

/* ---------- Pricing page sections ---------- */

.analysts--divided .analysts__inner {
  margin-bottom: 48px;
}
.analysts--divided .analysts__inner:after {
  content: "";
  display: block;
  height: 1px;
  margin-top: 48px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.2) 20%,
    rgba(255, 255, 255, 0.2) 80%,
    transparent
  );
}
@media (max-width: 768px) {
  .analysts--divided .analysts__inner {
    margin-bottom: 32px;
  }
  .analysts--divided .analysts__inner:after {
    margin-top: 32px;
  }
}
.verdicts .section-head,
.includes .section-head {
  max-width: none;
}
.verdicts .section-head p,
.includes .section-head p {
  max-width: 880px;
  margin-inline: auto;
}
.verdicts {
  --accent: #6984e4;
  --accent-rgb: 105, 132, 228;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  background: radial-gradient(
      50% 60% at 50% 0%,
      rgba(105, 132, 228, 0.07),
      transparent 70%
    ),
    #131314;
}
.verdicts__inner {
  width: min(100% - clamp(32px, 6.25vw, 48px), 1312px);
  margin-inline: auto;
}
.verdicts__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 1024px) {
  .verdicts__list {
    grid-template-columns: 1fr;
    max-width: 640px;
    margin-inline: auto;
  }
}
.verdict {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 32px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 24px;
  background: linear-gradient(
      180deg,
      rgba(var(--accent-rgb), 0.07),
      transparent 45%
    ),
    linear-gradient(#526ccc1c, #526ccc1c), #131314;
  transition: border-color 0.3s ease;
}
.verdict:hover {
  border-color: rgba(var(--accent-rgb), 0.45);
}
.verdict__badge {
  position: absolute;
  top: 24px;
  right: 24px;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 1px solid rgba(var(--accent-rgb), 0.4);
  border-radius: 50%;
  background: rgba(var(--accent-rgb), 0.12);
}
.verdict__badge svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: var(--accent);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.verdict__art {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  margin-bottom: 24px;
}
.verdict__icon {
  display: block;
  width: 48px;
  height: 48px;
  max-width: none;
  object-fit: contain;
  overflow: visible;
}
.verdict__label {
  color: var(--accent);
  font-weight: 400;
  font-size: 0.875rem;
}
.verdict .h5 {
  margin-top: 8px;
  font-size: 1.375rem;
  line-height: 1.2;
}
.verdict p {
  margin-top: 12px;
  color: #dfd5c4;
}
.includes__inner {
  width: min(100% - clamp(32px, 6.25vw, 48px), 1312px);
  margin-inline: auto;
}
.bento {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.bento__tile {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 28px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 24px;
  background: linear-gradient(#526ccc1c, #526ccc1c), #131314;
  overflow: hidden;
  transition: border-color 0.3s ease;
}
.bento__tile:hover {
  border-color: #526ccc73;
}
.bento__tile h3 {
  font-size: 1.25rem;
  line-height: 1.25;
}
.bento__tile p {
  margin-top: 8px;
  color: #dfd5c4;
  font-size: 0.9375rem;
}
.bento__tile--pde {
  grid-column: span 2;
  grid-row: span 2;
  justify-content: flex-end;
  min-height: 440px;
  padding: 32px;
  border-color: #f0f0fa1f;
  background: radial-gradient(
      70% 60% at 80% 20%,
      rgba(82, 108, 204, 0.3),
      transparent 70%
    ),
    linear-gradient(180deg, #1a1a1a, #1a1a1a00), #191a22;
}
.bento__tile--pde:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(
    20deg,
    rgba(25, 26, 34, 0.95) 25%,
    transparent 65%
  );
  pointer-events: none;
}
.bento__tile--pde > :not(.bento__neb) {
  z-index: 1;
}
.bento__tile--pde h3 {
  position: relative;
  max-width: 420px;
  font-weight: 500;
  font-size: clamp(1.75rem, 2.6vw, 2.25rem);
  line-height: 1.1;
}
.bento__tile--pde p {
  position: relative;
  max-width: 440px;
  margin-top: 12px;
  font-size: 1rem;
}
.bento__tile--wide {
  grid-column: span 2;
  flex-direction: row;
  align-items: center;
  gap: 20px;
}
.bento__tile--wide .bento__art {
  margin-bottom: 0;
}
.bento__neb {
  position: absolute;
  top: -42%;
  right: -38%;
  width: 100%;
  aspect-ratio: 1;
  opacity: 0.5;
  pointer-events: none;
  -webkit-mask-image: radial-gradient(closest-side, #000 50%, transparent);
  mask-image: radial-gradient(closest-side, #000 50%, transparent);
}
.bento__neb img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.bento__tag {
  position: relative;
  align-self: flex-start;
  margin-bottom: 16px;
  padding: 4px 12px;
  border-radius: 999px;
  background: #526ccc33;
  color: #b9c5f0;
  font-size: 0.8125rem;
}
.bento__art {
  display: grid;
  flex: none;
  place-items: center;
  width: 52px;
  height: 52px;
  margin-bottom: 24px;
}
.bento__icon {
  display: block;
  width: 48px;
  height: 48px;
  max-width: none;
  object-fit: contain;
  overflow: visible;
}
@media (max-width: 1024px) {
  .bento {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .bento__tile--pde {
    min-height: 380px;
  }
}
@media (max-width: 640px) {
  .bento {
    grid-template-columns: 1fr;
  }
  .bento__tile--pde,
  .bento__tile--wide {
    grid-column: auto;
  }
  .bento__tile--pde {
    grid-row: auto;
    min-height: 340px;
  }
  .bento__tile--wide {
    flex-direction: column;
    align-items: flex-start;
  }
  .bento__tile--wide .bento__art {
    margin-bottom: 24px;
  }
}
.together--flush {
  padding-bottom: 0;
}
.together__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 32px;
}
.together__actions .together__btn {
  margin-top: 0;
}
.together__actions .together__btn--quiet {
  color: #fff;
  background: transparent;
  border-color: #526ccc;
}
.together__actions .together__btn--quiet:hover {
  background: #526ccc29;
  border-color: #526ccc;
}
.together--split .together__card {
  padding-inline: 0;
  text-align: left;
}
.together--split .together__inner {
  width: min(100% - clamp(32px, 6.25vw, 48px), 1312px);
  margin-inline: auto;
  position: relative;
}
.together--split .together__copy {
  max-width: 600px;
  margin-inline: 0;
}
.together--split .together__text {
  margin-inline: 0;
}
.together--split .together__actions {
  justify-content: flex-start;
}
.together--split .together__moss {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  pointer-events: none;
}
.together--split .together__moss img {
  position: absolute;
  top: 78%;
  left: max(
    66%,
    (100% - min(100% - clamp(32px, 6.25vw, 48px), 1312px)) / 2 + 600px + 32px +
      17%
  );
  width: 100%;
  max-width: none;
  height: auto;
  transform: translate(-50%, -50%) rotate(-35deg);
}
.together--split.is-armed:not(.is-in) .together__moss {
  opacity: 0;
}
.together--split.is-armed.is-in .together__moss {
  animation: inview-rise 1.2s cubic-bezier(0.22, 1, 0.36, 1) 0.3s both;
}
@media (max-width: 1024px) {
  .together--split .together__copy,
  .together--split .together__text {
    max-width: none;
  }
  .together--split .together__moss {
    opacity: 0.7;
  }
  .together--split .together__moss img {
    top: auto;
    right: -40px;
    bottom: 0;
    left: auto;
    width: 100%;
    transform: translateY(38%) scale(1.2);
    transform-origin: bottom right;
  }
}
@media (max-width: 640px) {
  .together--split .together__moss {
    opacity: 0.5;
  }
  .together--split .together__actions {
    flex-direction: column;
  }
  .together--split .together__actions .btn {
    justify-content: center;
    width: 100%;
    text-align: center;
  }
  .together--split .together__moss img {
    width: 160%;
    transform: translateY(42%) scale(1.2);
  }
}

/* Link cards, style 1: the optional top text above the card title. */
.figure-card__tag {
  margin-bottom: 8px;
  color: #6984e4;
  font-weight: 400;
  font-size: 0.875rem;
}
.contact-links .section-head p {
  max-width: 760px;
  margin-inline: auto;
}

/* Hero (contact form), "White thank-you message": after submit, no card title and a white message. */
.sol-hero__form.is-submitted > h2 {
  display: none;
}
.hs-embed.is-white-thanks .submitted-message,
.hs-embed.is-white-thanks .submitted-message * {
  color: #fff !important;
}

/* HubSpot thank-you message (shown after submit): space under its heading. */
.hs-embed .submitted-message h3 {
  margin-bottom: 16px;
}