/* Shared alignment for non-home page banners. The homepage uses .hero and is untouched. */
main > .page-head {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

main > .page-head > .container {
  position: relative;
  top: auto !important;
  left: auto !important;
  margin: auto !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center !important;
}

main > .page-head > .container :is(h1, .lead) {
  width: 100%;
  margin-inline: auto !important;
  text-align: center !important;
}

main > .page-head .page-head__actions,
main > .page-head .btn-row {
  justify-content: center !important;
}

/* The calculator's banner is an adaptive, full-width green surface. */
body.fee-calculator-page main > .fee-calculator-banner {
  box-sizing: border-box;
  display: grid !important;
  place-items: center;
  width: 100%;
  min-height: calc(100vh - var(--topbar-h, 84px)) !important;
  min-height: calc(100svh - var(--topbar-h, 84px)) !important;
  height: auto !important;
  max-height: none !important;
  padding-block: clamp(3rem, 6vw, 5.5rem) !important;
  overflow: visible !important;
  background:
    radial-gradient(ellipse at 13% 12%, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, 0) 44%),
    radial-gradient(ellipse at 88% 86%, rgba(0, 209, 106, .09) 0%, rgba(0, 209, 106, 0) 52%),
    linear-gradient(112deg, #ffffff 0%, #f8fffb 25%, #eaf8ef 61%, #f7fffa 100%) !important;
}

body.fee-calculator-page main > .fee-calculator-banner > .fee-calculator-banner__layout {
  box-sizing: border-box;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: center !important;
  justify-items: center;
  gap: clamp(1.5rem, 3vw, 2.5rem) !important;
  width: min(var(--fee-content-max, 1440px), calc(100% - 2 * var(--fee-content-gutter, 24px))) !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin-inline: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body.fee-calculator-page main .fee-calculator-banner__copy {
  width: 100%;
  max-width: 72rem;
  margin-inline: auto;
  text-align: center !important;
}

body.fee-calculator-page main .fee-calculator-banner__copy > .page-head {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  color: var(--fee-ink, #142929) !important;
  text-align: center !important;
}

body.fee-calculator-page main .fee-calculator-banner__copy > .page-head > .fee-calculator-banner__heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin: 0 !important;
  text-align: center !important;
}

body.fee-calculator-page main .fee-calculator-banner__heading :is(h1, .lead),
body.fee-calculator-page main .fee-calculator-banner__intro :is(h2, p) {
  margin-inline: auto !important;
  text-align: center !important;
}

body.fee-calculator-page main .fee-calculator-banner__heading h1 {
  max-width: 100% !important;
  margin-bottom: .65rem !important;
}

body.fee-calculator-page main .fee-calculator-banner__heading .lead {
  max-width: 68ch !important;
}

body.fee-calculator-page main .fee-calculator-banner__intro {
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
}

body.fee-calculator-page main .fee-calculator-banner__intro h2 {
  max-width: 100% !important;
  color: var(--fee-accent, #00D16A) !important;
}

body.fee-calculator-page main .fee-calculator-banner__intro p {
  max-width: 68ch !important;
}

body.fee-calculator-page main #fee-calc.fee-estimator {
  width: min(100%, 70rem) !important;
  max-width: 70rem !important;
  margin-inline: auto !important;
  justify-self: center;
}

/* Canonical layout for the three fee feature items. */
body.fee-calculator-page main > .fee-calculator-banner > .fee-calculator-banner__layout > .fee-features {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: start !important;
  justify-content: space-between !important;
  gap: clamp(1.5rem, 3.5vw, 3.5rem) !important;
  width: 100% !important;
  max-width: none !important;
  margin: 20px 0 0 !important;
}

body.fee-calculator-page main .fee-calculator-banner .fee-features > .fee-feature {
  box-sizing: border-box !important;
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  align-items: center !important;
  align-self: start !important;
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  min-block-size: 0 !important;
  max-inline-size: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: center !important;
}

body.fee-calculator-page main .fee-calculator-banner .fee-features > .fee-feature::before {
  content: none !important;
  display: none !important;
  background: none !important;
}

body.fee-calculator-page main .fee-calculator-banner .fee-features > .fee-feature > .fee-feature__icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: center !important;
  inline-size: var(--shared-back-to-top-size, 70px) !important;
  block-size: var(--shared-back-to-top-size, 70px) !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #fff !important;
  color: #00D16A !important;
}

body.fee-calculator-page main .fee-calculator-banner .fee-features > .fee-feature > .fee-feature__icon > svg {
  display: block !important;
  inline-size: var(--shared-back-to-top-icon-size, 28px) !important;
  block-size: var(--shared-back-to-top-icon-size, 28px) !important;
}

body.fee-calculator-page main .fee-calculator-banner .fee-features > .fee-feature > h3 {
  align-self: stretch !important;
  inline-size: 100% !important;
  margin: 0 0 .35rem !important;
  color: var(--fee-ink, #142929) !important;
  font-size: var(--fee-h4-size) !important;
  font-weight: 600 !important;
  line-height: var(--fee-h4-line) !important;
  text-align: center !important;
}

body.fee-calculator-page main .fee-calculator-banner .fee-features > .fee-feature > p {
  align-self: stretch !important;
  inline-size: 100% !important;
  margin: 0 !important;
  color: var(--fee-ink-3) !important;
  font-size: var(--fee-body-m-size) !important;
  line-height: var(--fee-body-m-line) !important;
  text-align: center !important;
}

@media (max-width: 760px) {
  body.fee-calculator-page main > .fee-calculator-banner > .fee-calculator-banner__layout > .fee-features {
    flex-direction: column !important;
    gap: 1.5rem !important;
  }

  body.fee-calculator-page main .fee-calculator-banner .fee-features > .fee-feature {
    flex: 0 0 auto !important;
  }
}

body.fee-calculator-page main #fee-calc .fee-result__foot {
  margin-top: 20px !important;
  border-top: 0 !important;
  padding-top: 0 !important;
}

body.fee-calculator-page main #fee-calc .fee-result {
  padding: 20px 30px !important;
}

body.fee-calculator-page main #fee-calc .fee-estimator__fields {
  border-radius: 24px !important;
}

@media (max-width: 600px) {
  body.fee-calculator-page main > .fee-calculator-banner {
    min-height: calc(100vh - var(--topbar-h, 84px)) !important;
    min-height: calc(100svh - var(--topbar-h, 84px)) !important;
    padding-block: 2.5rem !important;
  }

  body.fee-calculator-page main > .fee-calculator-banner > .fee-calculator-banner__layout {
    width: calc(100% - 2 * var(--fee-content-gutter, 15px)) !important;
  }
}

/* Keep dropdown hover borders aligned with the idle border color. */
body.fee-calculator-page main #fee-calc .fee-estimator__fields :is(.select, .fee-select__trigger):hover {
  border-color: transparent !important;
}

body.fee-calculator-page main #fee-calc .fee-estimator__fields .fee-select__trigger.select:hover,
body.fee-calculator-page main #fee-calc .fee-estimator__fields .fee-select__trigger.select[aria-expanded="true"]:hover {
  border-color: transparent !important;
  border-style: solid !important;
  box-shadow: none !important;
}

/* Keep the dropdown outline at its idle gray color while hovered. */
body.fee-calculator-page main #fee-calc .fee-estimator__fields button.fee-select__trigger:hover,
body.fee-calculator-page main #fee-calc .fee-estimator__fields button.fee-select__trigger.select:hover,
body.fee-calculator-page main #fee-calc .fee-estimator__fields button.fee-select__trigger.select[aria-expanded="true"]:hover,
body.fee-calculator-page main #fee-calc .fee-estimator__fields button.fee-select__trigger--inline:hover,
body.fee-calculator-page main #fee-calc .fee-estimator__fields button.select:hover {
  border-color: var(--fee-rule) !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* Center every content-page banner while leaving the homepage .hero untouched. */
body.home-v2.support-page:is(.about-page, .contact-page, .help-page, .legal-page) main > .page-head,
body.home-v2:is(.pricing-page, .escrow-types, .dispute-process) main > .page-head,
body:is(.security-page, .explore-page, .what-is-escrow) main > .page-head,
body:not(.home-v2) main > .page-head {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.home-v2.support-page:is(.about-page, .contact-page, .help-page, .legal-page) main > .page-head > .container,
body.home-v2:is(.pricing-page, .escrow-types, .dispute-process) main > .page-head > .container,
body:is(.security-page, .explore-page, .what-is-escrow) main > .page-head > .container,
body:not(.home-v2) main > .page-head > .container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  top: auto !important;
  left: auto !important;
  margin: auto !important;
  text-align: center !important;
}

body.home-v2.support-page:is(.about-page, .contact-page, .help-page, .legal-page) main > .page-head :is(h1, .lead, .page-head__kicker),
body.home-v2:is(.pricing-page, .escrow-types, .dispute-process) main > .page-head :is(h1, .lead, .page-head__kicker),
body:is(.security-page, .explore-page, .what-is-escrow) main > .page-head :is(h1, .lead, .page-head__kicker),
body:not(.home-v2) main > .page-head :is(h1, .lead, .page-head__kicker) {
  margin-inline: auto !important;
  text-align: center !important;
}

body.home-v2.support-page:is(.about-page, .contact-page, .help-page, .legal-page) main > .page-head :is(.page-head__actions, .btn-row),
body.home-v2:is(.pricing-page, .escrow-types, .dispute-process) main > .page-head :is(.page-head__actions, .btn-row),
body:is(.security-page, .explore-page, .what-is-escrow) main > .page-head :is(.page-head__actions, .btn-row),
body:not(.home-v2) main > .page-head :is(.page-head__actions, .btn-row) {
  justify-content: center !important;
}

body.fee-calculator-page main .fee-calculator-banner__copy {
  align-self: center !important;
  justify-self: center !important;
  text-align: center !important;
  transform: translateY(-60px) !important;
}

/* Place every non-homepage banner's content 60px higher than the prior alignment. */
body main > .page-head {
  align-items: flex-start !important;
  justify-content: center !important;
  padding-block-start: 0 !important;
}

body main > .page-head > .container {
  align-self: flex-start !important;
  justify-content: flex-start !important;
  margin-block-start: 200px !important;
  margin-block-end: 0 !important;
  margin-inline: auto !important;
}

body.fee-calculator-page main > .fee-calculator-banner {
  padding-block-start: clamp(3rem, 6vw, 5.5rem) !important;
}

body.fee-calculator-page main > .fee-calculator-banner > .fee-calculator-banner__layout {
  align-items: center !important;
  padding-block-start: 0 !important;
}

@media (max-width: 600px) {
  body.fee-calculator-page main > .fee-calculator-banner {
    padding-block-start: 2.5rem !important;
  }
}

/* The Help Center pages reserve the shared fixed header and fill the rest of
   the first viewport with their banner, including at mobile breakpoints. */
body.home-v2.support-page{--topbar-h:92px;}
@media (min-width:1400px) and (hover:hover){
  body.home-v2.support-page{
    --topbar-h:clamp(82.606256px,calc(63.573056px + 1.940376vw),91.514416px);
  }
}
@media (min-width:768px) and (max-width:1399.98px){
  body.home-v2.support-page{--topbar-h:104px;}
}
@media (max-width:767.98px){
  body.home-v2.support-page{--topbar-h:152px;}
}
body.home-v2.support-page:is(.about-page,.help-page,.contact-page) main>.page-head{
  box-sizing:border-box;
  height:calc(100vh - var(--topbar-h))!important;
  height:calc(100svh - var(--topbar-h))!important;
  min-height:calc(100svh - var(--topbar-h))!important;
  max-height:none!important;
}
/* The shared header is sticky and occupies its own layout space on these pages;
   remove the legacy fixed-header offset so each banner starts at its lower edge. */
body.home-v2.support-page:is(.about-page,.help-page,.contact-page) main{
  padding-block-start:0!important;
}

/* Show estimates as simple label/value groups instead of table rows. */
body.fee-calculator-page main #fee-result.fee-result .fee-result__list.fee-result__metrics {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 1.25rem 2rem !important;
  margin: 0 !important;
}

body.fee-calculator-page main #fee-result.fee-result .fee-result__list.fee-result__metrics > .fee-result__item {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: .35rem !important;
  grid-column: auto !important;
  grid-row: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  text-align: start !important;
}

body.fee-calculator-page main #fee-result.fee-result .fee-result__list.fee-result__metrics > .fee-result__item > dt {
  margin: 0 !important;
  color: var(--fee-ink-3, #6A807C) !important;
  font-size: 1rem !important;
  line-height: 1.4 !important;
}

body.fee-calculator-page main #fee-result.fee-result .fee-result__list.fee-result__metrics > .fee-result__item > dd {
  margin: 0 !important;
  color: var(--fee-ink, #142929) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: start !important;
  white-space: normal !important;
}

@media (max-width: 520px) {
  body.fee-calculator-page main #fee-result.fee-result .fee-result__list.fee-result__metrics {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 1rem !important;
  }
}



/* Move content-page banner copy up visually without changing layout. */
body:not(.fee-calculator-page) main > .page-head > .container {
  translate: 0 -60px;
}

/* Move the Explore Transactions banner copy another 60px above its current position. */
body.explore-page main > .page-head > .container {
  translate: 0 -120px !important;
}

/* Vertically center copy on the Escrow Types and Help Center banners. */
body.home-v2.escrow-types main > .page-head,
body.home-v2.support-page:is(.about-page, .contact-page, .help-page) main > .page-head {
  align-items: center !important;
}

body.home-v2.escrow-types main > .page-head > .container,
body.home-v2.support-page:is(.about-page, .contact-page, .help-page) main > .page-head > .container {
  align-self: center !important;
  justify-content: center !important;
  margin-block: auto !important;
  translate: none !important;
}

/* Legal document banners sit directly below the fixed shared navigation. */
body.home-v2.support-page.legal-page main > .page-head {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 520px !important;
  min-height: 520px !important;
  max-height: 520px !important;
  padding-block: 0 !important;
}

body.home-v2.support-page.legal-page main > .page-head > .container {
  align-self: center !important;
  justify-content: center !important;
  margin-block: auto !important;
  translate: none !important;
  text-align: center !important;
}

body.home-v2.support-page.legal-page main > .page-head :is(h1, .lead) {
  margin-inline: auto !important;
  text-align: center !important;
}

/* Keep legal banners immediately after the shared navigation in normal flow. */
body.home-v2.support-page.legal-page main {
  /* The shared sticky header remains in normal flow, so don't reserve its height twice. */
  padding-block-start: 0 !important;
}
body.home-v2.support-page.legal-page main > .page-head {
  margin-block-start: 0 !important;
  inset-block-start: 0 !important;
}

/* START: responsive-fee-banner-spacing-v1 */
@media(max-width:980px){
  body.fee-calculator-page main .fee-calculator-banner__copy{
    transform:none!important;
  }
  body.fee-calculator-page main > .fee-calculator-banner > .fee-calculator-banner__layout{
    padding-block-start:24px!important;
  }
  body.fee-calculator-page main > .fee-calculator-banner > .fee-calculator-banner__layout > .fee-features{
    grid-row:3!important;
  }
}
@media(max-width:600px){
  body.fee-calculator-page main > .fee-calculator-banner > .fee-calculator-banner__layout{
    padding:24px 20px!important;
  }
}
/* END: responsive-fee-banner-spacing-v1 */

/* Use the accent green when a page banner presents a single action. */
body main > .page-head .page-head__actions > .btn:only-child,
body main > .page-head .btn-row > .btn:only-child {
  background:#00D16A!important;
  border-color:#00D16A!important;
  color:#142929!important;
}