/* Font Styles
============================================================================= */
.fs-24 { font-size: var(--fs-24)!important; }

/* ==========================================================================
   Features Overview Page
============================================================================= */

/* ==========================================================================
   Feature Details Pages
============================================================================= */
.feature__hero { background: transparent!important; padding: 150px 5vw; position: relative; }
.feature__hero-video .video-wrapper { border: 1px solid #ccc; }
.feature__hero-img:not(.mx-auto) { transform: translateY(70px); display: inline-block;}
.feature__hero-content.text-center { padding: 0!important; }
.feature__hero-content h2 {  }
.feature__hero-content h2 span:first-child { color: var(--primary); font-weight: 600; letter-spacing: 0.36px; }
.feature__hero-content h2 span:last-child { font-weight: 600; }
.feature__hero-content p:not(.display-pre) { font-family: var(--secondary-font); letter-spacing: 0.64px; }
.feature__hero-graphic { position: absolute; top: 32%; left: 0; width: 2000px; z-index: -1; }
@media (max-width: 992px){
	.feature__hero-graphic { left: -15%; }
}
/* Feature Checks */
.featured__checks { color: #fff; font-size: 16px; letter-spacing: .64px; max-width: 1150px; margin: 0 auto 76px; }
.featured__checks p { position: relative; font-family: var(--secondary-font); }
/* .featured__checks p::before { content: '\f00c'; position: absolute; width: 37px; height: 37px; background: var(--primary); border-radius: 50%; left: -50px; font-family: 'Font Awesome 5 Pro'; display: flex; align-items: center; justify-content: center; font-size: 20px; } */

@media (max-width: 992px) {
	/* .featured__checks p::before { position: static; margin: 0 auto 20px; } */
}
@media (min-width: 992px){
	.featured__checks [class^="col-"]:last-child { padding-left: 50px; padding-right: 0; }
}

/* Feature Dropdown */
.feature__dropdown { }
.feature__dropdown .feature__dropdown-container { display: flex; gap: 50px 74px; justify-content: center; }
.feature__dropdown .feature__dropdown-container img { align-self: center; }
.feature__dropdown-content { flex-basis: 100%; }
.feature__dropdown-content > p { margin: 0 0 15px; line-height: 150%; }
.feature__dropdown-content > p:last-child { font-family: var(--secondary-font); margin: 15px 0 0; }
@media (min-width: 1301px){
	.feature__dropdown .feature__dropdown-container { justify-content: space-between; }
	.feature__dropdown-content { max-width: 598px; }
}
@media (max-width: 1300px){
	.feature__dropdown .feature__dropdown-container { flex-wrap: wrap; }
	.feature__dropdown-content { flex-grow: 1; }
}
/* Feature Explore */
.feature__explore { position: relative; }
.feature__explore p { margin: 0 0 19px; }
.feature__explore h3 { margin: 0 0 57px;}
.feature-explore__bg { position: absolute; left: 0; top: 50%; transform: translateY(-50%); z-index: -1; }
.feature__banner { background: #fff; border-radius: 20px; padding: 74px 15px 63px; max-width: 1518px; margin: 0 auto; display: grid; justify-content: center; gap: 90px 0; grid-template-columns: repeat(auto-fit, minmax(12.5%, 170px)); }
.feature__banner a { color: #000; font-weight: 700; font-size: 18px; letter-spacing: .36px; }
.feature__banner p { margin: 19px 0 0; line-height: 100%; }
.feature__banner svg { max-height: 27px; max-width: 27px; }

/* Gradient Box */
.gradient-box { max-width: 100%; border-radius: 20px; background: linear-gradient(170deg, #1D1D1D 4.88%, #111 105.98%); }

@media (max-width: 500px){
	.gradient-box { padding: 100px 40px 112px;}
}


@media(min-width: 992px) {
	.feature-explore__content { padding-top: 52px; position: relative; left: -50px; }
}


@media (min-width: 992px) and (max-width: 1400px) {
	.feature__hero-heading { font-size: 3vw; }
}
@media (min-width: 992px) {
	.feature__hero-content:not(.text-center) {  display: flex; flex-direction: column; justify-content: center; }
	.feature__hero-content:not(.text-center) .btn { align-self: flex-start; }
	.feature__hero .row { --bs-gutter-x: 54px; --bs-gutter-y: 50px; }
	.feature__hero .container { max-width: calc(5vw + 1388px); width: 100%; padding: 0; }
}
@media (max-width: 991px) {
  .feature__hero-content { text-align: center; padding-top: 160px!important; padding-bottom: 50px!important; }
	.feature__hero { text-align: center; }
}

/* Screening
============================================================================= */
.tenant-screening_imgs { display: flex; align-items: center; justify-content: center; gap: 45px; margin: 0 0 106px; flex-wrap: wrap; }

/* Screening Options */
#screening-options { padding: 300px 0 167px; }
#screening-options h2 { margin: 0 0 34px; }
@media (min-width: 992px){
	#screening-options h2 { max-width: 433px; }
}
/* Real Time Reporting */
#real-time-reporting { padding: 167px 0 152px; }
#real-time-reporting h2 { margin: 0 0 15px; }
#real-time-reporting .feature__dropdown-content { align-self: center; }
@media (min-width:1400px){
	#real-time-reporting .container { max-width: 1394px; }
}
@media (min-width: 1300px){
	#real-time-reporting .feature__dropdown-content p:not(.display-pre) { max-width: 486px; }
}

/* Screening Package */
.tenant-screening__package { padding: 200px 15px; position: relative; }
.tenant-screening__package p { margin: 0 0 20px; }
.tenant-screening__package h3 { margin: 0 0 41px!important; }
.tenant-screening__package-bg { position: absolute; left: auto; right: 0; bottom: -70%; transform: translateY(10%); z-index: -1; }

/* RentGrade
============================================================================= */
#rentgrade-hero .feature__hero-content h2 { margin: 0 0 27px; }
#rentgrade-hero .feature__hero-content h2 span { line-height: 1.5; margin: 0 0 17px; }
#rentgrade-hero .feature__hero-content p { font-size: 16px; font-family: var(--secondary-font); }
#rentgrade-hero .feature__hero-graphic { top: 44%; }

@media (min-width: 992px){
	#rentgrade-hero .feature__hero-content p { max-width: 535px; }
	#rentgrade-hero .featured__checks { margin-top: 143px; }
}

/* RentGrade Defined */
#rentgrade-defined header { max-width: 790px; margin: 0 0 144px; }
#rentgrade-defined header p:not(.display-pre) { font-weight: 500; letter-spacing: 0.36px; }
.rentgrade-grading__container { display: flex; justify-content: center; align-items: center; gap: 126px; flex-wrap: wrap; }
.rentgrade-grading__container:not(:nth-of-type(1)) { margin-top: 200px; }
.rentgrade-grading__container .rentgrade-grading__letter { position: relative; max-width: 100%; }
.rentgrade-grading__container .rentgrade-grading__letter::before { content: ''; width: 284.005px; height: 265.373px; transform: rotate(-38.974deg); flex-shrink: 0; border-radius: 284.005px; background: linear-gradient(183deg, #00A54F 2.58%, #67C9A4 147.69%); filter: blur(150px); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.rentgrade-grading__container:nth-of-type(2) .rentgrade-grading__letter::before { background: linear-gradient(183deg, #167FE1 2.58%, #62AEEF 147.69%); }
.rentgrade-grading__container:nth-of-type(2) .display-pre { color: var(--secondary); }
.rentgrade-grading__container:nth-of-type(3) .rentgrade-grading__letter::before { background: linear-gradient(183deg, #6826A9 2.58%, #C59AF1 147.69%); }
.rentgrade-grading__container:nth-of-type(3) .display-pre { color: #984fe2; }
.rentgrade-grading__container:nth-of-type(4) .rentgrade-grading__letter::before { background: linear-gradient(183deg, #F84848 2.58%, #FC8989 147.69%); }
.rentgrade-grading__container:nth-of-type(4) .display-pre { color: #F84848; }
.rentgrade-grading__bg { border-radius: 20px; height: 335px; width: 339px; max-width: 100%; background: linear-gradient(170deg, #262626 4.88%, #111 105.98%); display: flex; flex-direction: column; justify-content: center; position: relative; }
.rentgrade-grading__bg h3 { font-size: 200px; font-weight: 800; color: #fff; line-height: 90%; }
.rentgrade-grading__bg h4 { font-size: 50px; letter-spacing: 1px; opacity: 0.2; line-height: 90%; font-weight: 800; margin: 0 0 20px; }
.rentgrade-grading__details { text-align: left; flex-basis: 600px; }
.rentgrade-grading__details > h3 { font-size: 30px; font-weight: 700; margin: 0 0 14px; }
.rentgrade-grading__details .display-pre + p { max-width: 500px; margin: 0 0 35px; }
@media (min-width: 992px){
	#rentgrade-defined { padding-top: 295px; padding-bottom: 322px; }
}

/* Rentgrade Key Details */
#rentgrade__key-details { position: relative; }
#rentgrade__key-details .d-flex { gap: 33px; flex-wrap: wrap; }
#rentgrade__key-details header h3 { font-size: 55px; font-weight: 700; line-height: 110%; margin-bottom: 53px; }
#rentgrade__key-details .btn { margin-top: 50px; }
#rentgrade__key-details .gradient-box { width: 484px; height: 378px; padding: 100px 79px 112px; }
#rentgrade__key-details .gradient-box svg { max-height: 25px; width: auto; color: #fff; }
#rentgrade__key-details .gradient-box h3 { font-size: 30px; color: #fff; font-weight: 600; letter-spacing: 0.6px; line-height: 110%; margin: 20px 0 16px; }
#rentgrade__key-details .gradient-box p { font-size: 16px; font-weight: 400; line-height: 150%;  }
.rentgrade__key-details-graphic { position: absolute; right: 0; top: -25%; z-index: -1; }
@media (min-width: 992px){
	#rentgrade__key-details { padding-bottom: 285px; }
}

/* TransUnion
============================================================================= */
#transunion-hero .feature__hero-content h2 { margin: 0 0 27px; }
#transunion-hero .feature__hero-content h2 span { line-height: 1.5; margin: 0 0 17px; }
#transunion-hero .feature__hero-content p { font-size: 16px; }
#transunion-hero .featured__checks { margin-top: 143px; }
#transunion-hero .feature__hero-graphic { top: 44%; }
@media (min-width: 992px){
	#transunion-hero .feature__hero-content p { max-width: 567px; }
}

#transunion-vs header { max-width: 869px; }
#transunion-vs header p:nth-child(n+4) { font-family: var(--secondary-font); }
@media (min-width: 992px){
	#transunion-vs { padding-top: 295px; }
}

/* ResidentScore Explained */
#transunion-explained {  }
#transunion-explained header { margin-bottom: 59px; }
#transunion-explained .container-fluid { max-width: 1260px; flex-wrap: wrap; gap: 47px 49px; counter-reset: box-counter; }
#transunion-explained .gradient-box { padding: 57px 52px 61px; }
#transunion-explained .gradient-box h3 { font-size: 22px; color: #fff; font-weight: 500; line-height: 150%; letter-spacing: 0.44px; padding-left: 57px; position: relative; margin: 0 0 40px; }
#transunion-explained .gradient-box h3::before { content: counter(box-counter); counter-increment: box-counter; position: absolute; left: 0;  height: 43px; width: 43px; border-radius: 50%; background: #00a54f; color: #000; display: flex; align-items: center; justify-content: center; top: -6px; }
#transunion-explained .gradient-box:nth-child(2) h3::before { background: #167fe1; }
#transunion-explained .gradient-box:nth-child(3) h3::before { background: #a94ec7; }
#transunion-explained .gradient-box:nth-child(4) h3::before { background: #f84848; }
#transunion-explained .gradient-box ul { margin: 0 0 28px 12px; }
#transunion-explained .gradient-box p, #transunion-explained .gradient-box ul { font-family: var(--secondary-font); }
#transunion-explained .gradient-box p:last-child { color: #fff; font-weight: 500; letter-spacing: 0.64px; margin: 0; }

@media (max-width: 375px){
	#transunion-explained .gradient-box { padding: 57px 30px 61px; }
}

/* ==========================================================================
  Accordion
============================================================================= */
.accordion--sm { }
.accordion--sm .accordion-item { margin-bottom: 0; border-bottom: 1px solid #494949!important; padding-bottom: 0; }
.accordion--sm .accordion-item:last-child { border-bottom: 0!important; }
.accordion--sm .accordion-item, .accordion--sm .accordion-button { background: none; color: #fff; }
.accordion--sm .accordion-button { padding: 24px 0; font-size: 20px; font-weight: 500; letter-spacing: 0.8px; transition: 0.3s; }
.accordion--sm .accordion-button.collapsed:hover, .accordion--sm .accordion-button:not(.collapsed) { color: var(--primary); transition: 0.3s; }
.accordion--sm .accordion-button:not(.collapsed)::after { transform: rotate(-180deg); }
.accordion--sm .accordion-button::before { display: none; }
.accordion--sm .accordion-button::after { background-image: none!important; content: '\f078'; font-family: "Font Awesome 5 Pro"; margin: 0; height: 15px; width: 15px; font-size: 15px; }
