/* Option pricing, featured middle (C16). Generated from mockup/sections/appfolio/11-hubspot-appfolio-integration-pricing.html and css/appfolio.css. */
@keyframes i-up {from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.gx-optioncards .gm-dark a:focus-visible,.gx-optioncards.gm-dark a:focus-visible,.gx-optioncards .gm-dark button:focus-visible,.gx-optioncards.gm-dark button:focus-visible,.gx-optioncards #contact a:focus-visible,.gx-optioncards footer a:focus-visible {outline-color:#FFFFFF}
.gx-optioncards .gm-plain {list-style:none;margin:0;padding:0}
.gx-optioncards .i-kick {margin:0;font-size:14px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:#5834C7}
.gx-optioncards .i-kick-d {color:#18C7C3}
.gx-optioncards .i-h2 {margin:0;font-family:'Jost',Arial,sans-serif;font-weight:700;font-size:64px;line-height:1.1;letter-spacing:-.02em;color:#19152F}
.gx-optioncards .i-lede {margin:0;max-width:680px;font-size:20px;line-height:1.6;color:#655B77}
.gx-optioncards .i-hr.is-wait>* {opacity:0;transform:translateY(20px)}
.gx-optioncards .i-hr.is-wait.is-in>* {animation:i-up 1.2s cubic-bezier(.2,.7,.2,1) both}
.gx-optioncards .i-hr.is-wait.is-in>:nth-child(2) {animation-delay:.15s}
.gx-optioncards .i-hr.is-wait.is-in>:nth-child(3) {animation-delay:.3s}
.gx-optioncards .i-list {list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.gx-optioncards .i-list li {display:flex;gap:12px;padding:12px 0;border-top:1px solid #E3E0EE;font-size:16px;line-height:1.5;color:#313335}
.gx-optioncards .i-list li:last-child {border-bottom:1px solid #E3E0EE}
.gx-optioncards .i-check {flex-shrink:0;margin-top:2px}
.gx-optioncards .i-opt {display:flex;flex-direction:column;gap:20px;padding:40px 36px;border:1px solid #E3E0EE;background:#FFFFFF}
.gx-optioncards .i-opt-feat {border:2px solid #5834C7}
.gx-optioncards .gm-dark .i-opt,.gx-optioncards.gm-dark .i-opt {border-color:#FFFFFF}
.gx-optioncards .gm-dark .i-opt-feat,.gx-optioncards.gm-dark .i-opt-feat {border-color:#18C7C3}
.gx-optioncards .gm-dark .i-crumb:hover,.gx-optioncards.gm-dark .i-crumb:hover,.gx-optioncards .gm-dark .i-crumb:focus-visible,.gx-optioncards.gm-dark .i-crumb:focus-visible {color:#FFFFFF!important}
.gx-optioncards .i-dot,.gx-optioncards .i-glass {background:rgba(255,255,255,.1)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.36);-webkit-backdrop-filter:blur(2px) saturate(160%);backdrop-filter:blur(2px) saturate(160%)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .gx-optioncards .i-dot,.gx-optioncards .i-glass {background:#2A2346!important}
}
.gx-optioncards .i-opt.i-glass:not(.i-opt-feat) {border:0}
.gx-optioncards .i-prow-l.i-glass {box-shadow:inset 0 0 0 1px rgba(255,255,255,.36)}
.gx-optioncards .i-inc .i-check {margin-top:3px}
.gx-optioncards .i-glass .i-list li {color:#FFFFFF;border-color:rgba(255,255,255,.24)}
.gx-optioncards .i-glass .i-list li:last-child {border-bottom-color:rgba(255,255,255,.24)}
.gx-optioncards .i-glass .i-list a {color:#FFFFFF}
.gx-optioncards-s1.gx-optioncards-s1 { display: grid;grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);gap: 80px;align-items: end }
.gx-optioncards-s2.gx-optioncards-s2 { display: flex;flex-direction: column;gap: 20px;max-width: 900px }
.gx-optioncards-s3.gx-optioncards-s3 { font-size: 56px;color: #FFFFFF }
.gx-optioncards-s4.gx-optioncards-s4 { color: #18C7C3 }
.gx-optioncards-s5.gx-optioncards-s5 { margin: 0;font-family: 'Jost', Arial, sans-serif;font-weight: 600;font-size: 26px;line-height: 1.25;color: #18C7C3 }
.gx-optioncards-s6.gx-optioncards-s6 { display: flex;flex-direction: column;gap: 12px }
.gx-optioncards-s7.gx-optioncards-s7 { margin: 0;font-family: 'Jost', Arial, sans-serif;font-weight: 600;font-size: 22px;color: #FFFFFF }
.gx-optioncards-s8.gx-optioncards-s8 { color: #C9C2DA;max-width: 560px }
.gx-optioncards-s9.gx-optioncards-s9 { display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));gap: 24px;align-items: stretch }
.gx-optioncards-s10.gx-optioncards-s10 { margin: 0 }
.gx-optioncards-s11.gx-optioncards-s11 { margin: 0;font-family: 'Jost', Arial, sans-serif;font-weight: 600;font-size: 26px;line-height: 1.15;white-space: nowrap;color: #FFFFFF }
.gx-optioncards-s12.gx-optioncards-s12 { display: flex;flex-direction: column;gap: 6px }
.gx-optioncards-s13.gx-optioncards-s13 { margin: 0;font-size: 14px;font-weight: 600;color: #D9D4E6 }
.gx-optioncards-s14.gx-optioncards-s14 { margin: 0;display: flex;align-items: baseline;gap: 6px }
.gx-optioncards-s15.gx-optioncards-s15 { font-family: 'Jost', Arial, sans-serif;font-weight: 700;font-size: 40px;line-height: 1;color: #3E88FF }
.gx-optioncards-s16.gx-optioncards-s16 { font-size: 16px;color: #D9D4E6 }
.gx-optioncards-s17.gx-optioncards-s17 { margin: 0;font-size: 17px;line-height: 1.6;color: #D9D4E6 }
.gx-optioncards-s18.gx-optioncards-s18 { display: flex;flex-direction: column;gap: 4px }
.gx-optioncards-s19.gx-optioncards-s19 { margin: 0 0 8px;font-size: 14px;font-weight: 600;color: #FFFFFF }
.gx-optioncards-s20.gx-optioncards-s20 { margin-top: auto;align-self: flex-start;display: inline-flex;align-items: center;gap: 10px;height: 56px;padding: 0 28px;background: #FFFFFF;color: #19152F;text-decoration: none;font-size: 17px;font-weight: 600 }
.gx-optioncards-s21.gx-optioncards-s21 { margin-top: auto;align-self: flex-start;display: inline-flex;align-items: center;gap: 10px;height: 56px;padding: 0 28px;background: #5834C7;color: #FFFFFF;text-decoration: none;font-size: 17px;font-weight: 600 }
.gx-optioncards-s22.gx-optioncards-s22 { display: flex;flex-direction: column;gap: 56px }
@media (max-width: 1100px) {
  .gx-optioncards-s1.gx-optioncards-s1 { grid-template-columns:minmax(0,1fr)!important }
  .gx-optioncards-s3.gx-optioncards-s3 { font-size:38px!important;line-height:1.1!important }
  .gx-optioncards-s9.gx-optioncards-s9 { grid-template-columns:minmax(0,1fr)!important }
}
@media (max-width: 640px) {
  .gx-optioncards-s5.gx-optioncards-s5 { font-size:24px!important;line-height:1.25!important }
  .gx-optioncards-s7.gx-optioncards-s7 { font-size:20px!important }
  .gx-optioncards-s11.gx-optioncards-s11 { font-size:24px!important;line-height:1.25!important }
  .gx-optioncards-s15.gx-optioncards-s15 { font-size:24px!important;line-height:1.25!important }
}