Good property
decisions feel different.
From finding a first home to making an
investment, the right guidance can change
the entire experience.
“
APTDEAL made the process feel
incredibly straightforward. I wasn’t
jumping between endless listings —
I finally felt like I was making an
informed decision.
AM
Aarav Menon
HOME BUYER
✓
VERIFIED EXPERIENCE
PROPERTY SEARCH
3 BHK Apartment
Bengaluru · Karnataka
★★★★★
5.0 / 5
01
03
←
→
01
BUYER
“
The experience was much more
transparent than what I expected
from a property search.
Aarav Menon
Bengaluru
02
SELLER
“
Listing our property felt simple,
professional and far less complicated
than we imagined.
Neha Kapoor
Kochi
03
INVESTOR
“
I was looking for clarity rather than
simply more properties. That’s what
made the difference.
Rohan Shah
Hyderabad
01
BUYERS
02
SELLERS
03
INVESTORS
THE APTDEAL APPROACH
Less noise.
More clarity.
/* =========================================================
RESET
========================================================= */
.apt09,
.apt09 * {
box-sizing: border-box;
}
/* =========================================================
MAIN
========================================================= */
.apt09 {
width: 100%;
background: #f3f3f1;
color: #080808;
font-family:
Arial,
Helvetica,
sans-serif;
overflow: hidden;
}
.apt09-container {
width: min(1440px, 92%);
margin: 0 auto;
padding: 115px 0 105px;
}
/* =========================================================
HEADER
========================================================= */
.apt09-header {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 25px;
border-bottom:
1px solid #d4d4d1;
}
.apt09-eyebrow {
display: flex;
align-items: center;
gap: 12px;
font-size: 9px;
font-weight: 800;
letter-spacing: 2px;
color: #777777;
}
.apt09-line {
width: 35px;
height: 1px;
background: #080808;
}
.apt09-number {
font-size: 10px;
font-weight: 700;
letter-spacing: 2px;
color: #999999;
}
/* =========================================================
INTRO
========================================================= */
.apt09-intro {
display: grid;
grid-template-columns:
1.3fr
.7fr;
gap: 80px;
padding: 75px 0 65px;
}
.apt09-intro h2 {
margin: 0;
font-size:
clamp(57px, 7vw, 100px);
line-height: .89;
letter-spacing: -5px;
font-weight: 500;
}
.apt09-intro h2 span {
display: block;
color: #888888;
font-weight: 300;
}
.apt09-intro p {
max-width: 330px;
align-self: end;
margin: 0;
font-size: 13px;
line-height: 1.75;
color: #777777;
}
/* =========================================================
FEATURED TESTIMONIAL
========================================================= */
.apt09-featured {
display: grid;
grid-template-columns:
1.35fr
.65fr;
min-height: 470px;
background: #080808;
color: #ffffff;
}
/* =========================================================
LEFT
========================================================= */
.apt09-featured-left {
padding: 55px 60px;
display: flex;
flex-direction: column;
}
.apt09-quote-mark {
font-size: 90px;
line-height: .5;
height: 55px;
color: #ffffff;
font-family:
Georgia,
serif;
font-weight: 400;
}
.apt09-main-quote {
max-width: 790px;
margin: auto 0;
font-size:
clamp(30px, 4vw, 52px);
line-height: 1.08;
letter-spacing: -2px;
font-weight: 400;
}
/* =========================================================
AUTHOR
========================================================= */
.apt09-author {
display: flex;
align-items: center;
gap: 13px;
margin-top: 40px;
}
.apt09-avatar {
width: 43px;
height: 43px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: #ffffff;
color: #080808;
font-size: 9px;
font-weight: 800;
}
.apt09-author strong {
display: block;
font-size: 12px;
font-weight: 600;
}
.apt09-author span {
display: block;
margin-top: 4px;
font-size: 7px;
letter-spacing: 1.4px;
color: #777777;
font-weight: 800;
}
/* =========================================================
RIGHT
========================================================= */
.apt09-featured-right {
padding: 50px 40px;
border-left:
1px solid rgba(255,255,255,.14);
display: flex;
flex-direction: column;
}
.apt09-verified {
display: flex;
align-items: center;
gap: 9px;
font-size: 7px;
letter-spacing: 1.5px;
font-weight: 800;
color: #777777;
}
.apt09-verified span {
width: 19px;
height: 19px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: #ffffff;
color: #080808;
font-size: 9px;
}
/* =========================================================
PROPERTY
========================================================= */
.apt09-property {
margin-top: auto;
padding-top: 35px;
border-top:
1px solid rgba(255,255,255,.14);
}
.apt09-property span {
display: block;
margin-bottom: 10px;
font-size: 7px;
letter-spacing: 1.5px;
font-weight: 800;
color: #777777;
}
.apt09-property strong {
display: block;
font-size: 21px;
font-weight: 500;
}
.apt09-property small {
display: block;
margin-top: 7px;
font-size: 10px;
color: #777777;
}
/* =========================================================
RATING
========================================================= */
.apt09-rating {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 35px;
padding-bottom: 22px;
border-bottom:
1px solid rgba(255,255,255,.14);
}
.apt09-rating span {
font-size: 12px;
letter-spacing: 4px;
}
.apt09-rating small {
font-size: 9px;
color: #777777;
}
/* =========================================================
COUNTER
========================================================= */
.apt09-counter {
display: flex;
align-items: center;
gap: 10px;
margin-top: 22px;
font-size: 8px;
font-weight: 800;
letter-spacing: 1px;
color: #777777;
}
.apt09-counter-line {
width: 65px;
height: 1px;
background: #555555;
}
/* =========================================================
CONTROLS
========================================================= */
.apt09-controls {
display: flex;
gap: 8px;
margin-top: auto;
}
.apt09-control {
width: 45px;
height: 45px;
border:
1px solid rgba(255,255,255,.25);
background: transparent;
color: #ffffff;
cursor: pointer;
font-size: 17px;
transition:
background .3s ease,
color .3s ease;
}
.apt09-control:hover {
background: #ffffff;
color: #080808;
}
/* =========================================================
CARDS
========================================================= */
.apt09-cards {
display: grid;
grid-template-columns:
repeat(3, 1fr);
gap: 12px;
margin-top: 12px;
}
.apt09-card {
min-height: 300px;
padding: 25px;
text-align: left;
border:
1px solid #d5d5d2;
background: transparent;
color: #080808;
cursor: pointer;
display: flex;
flex-direction: column;
transition:
background .35s ease,
color .35s ease,
border-color .35s ease;
}
.apt09-card:hover,
.apt09-card-active {
background: #080808;
border-color: #080808;
color: #ffffff;
}
/* =========================================================
CARD TOP
========================================================= */
.apt09-card-top {
display: flex;
align-items: center;
justify-content: space-between;
}
.apt09-card-top span {
font-size: 7px;
letter-spacing: 1.5px;
font-weight: 800;
}
.apt09-card-top span:last-child {
color: #888888;
}
/* =========================================================
CARD QUOTE
========================================================= */
.apt09-card-quote {
margin-top: 35px;
font-family:
Georgia,
serif;
font-size: 45px;
line-height: .5;
}
/* =========================================================
CARD TEXT
========================================================= */
.apt09-card p {
max-width: 300px;
margin: 25px 0 0;
font-family:
Georgia,
serif;
font-size: 18px;
line-height: 1.35;
}
.apt09-card-author {
margin-top: auto;
padding-top: 25px;
border-top:
1px solid #d5d5d2;
}
.apt09-card-active
.apt09-card-author,
.apt09-card:hover
.apt09-card-author {
border-color:
rgba(255,255,255,.2);
}
.apt09-card-author strong {
display: block;
font-size: 10px;
font-weight: 700;
}
.apt09-card-author span {
display: block;
margin-top: 5px;
font-size: 8px;
color: #888888;
}
/* =========================================================
TRUST STRIP
========================================================= */
.apt09-trust {
display: grid;
grid-template-columns:
.55fr
.55fr
.55fr
2.35fr;
margin-top: 70px;
border-top:
1px solid #d4d4d1;
border-bottom:
1px solid #d4d4d1;
}
.apt09-trust-item {
padding: 24px 20px;
border-right:
1px solid #d4d4d1;
}
.apt09-trust-item strong {
display: block;
font-size: 22px;
font-weight: 500;
}
.apt09-trust-item span {
display: block;
margin-top: 7px;
font-size: 7px;
letter-spacing: 1.5px;
color: #888888;
font-weight: 800;
}
.apt09-trust-statement {
padding: 24px 30px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 30px;
}
.apt09-trust-statement > span {
font-size: 7px;
letter-spacing: 1.5px;
font-weight: 800;
color: #888888;
}
.apt09-trust-statement strong {
font-size: 20px;
font-weight: 500;
}
.apt09-trust-statement strong span {
color: #888888;
font-weight: 300;
}
/* =========================================================
TABLET
========================================================= */
@media (max-width: 1000px) {
.apt09-container {
padding:
90px 0;
}
.apt09-intro {
grid-template-columns:
1fr;
gap: 35px;
}
.apt09-intro p {
align-self: auto;
}
.apt09-featured {
grid-template-columns:
1fr;
}
.apt09-featured-right {
min-height: 390px;
border-left: none;
border-top:
1px solid rgba(255,255,255,.14);
}
.apt09-cards {
grid-template-columns:
1fr;
}
.apt09-card {
min-height: 270px;
}
.apt09-trust {
grid-template-columns:
repeat(3, 1fr);
}
.apt09-trust-statement {
grid-column:
1 / -1;
border-top:
1px solid #d4d4d1;
}
}
/* =========================================================
MOBILE
========================================================= */
@media (max-width: 650px) {
.apt09-container {
width: 90%;
padding:
75px 0 70px;
}
.apt09-intro {
padding:
50px 0 45px;
}
.apt09-intro h2 {
font-size:
clamp(47px, 14vw, 70px);
letter-spacing: -3.5px;
}
.apt09-featured-left {
padding:
40px 25px;
}
.apt09-main-quote {
font-size: 30px;
letter-spacing: -1px;
line-height: 1.1;
}
.apt09-featured-right {
padding:
35px 25px;
}
.apt09-cards {
gap: 8px;
}
.apt09-card {
min-height: 280px;
padding: 21px;
}
.apt09-trust {
grid-template-columns:
1fr 1fr;
}
.apt09-trust-item {
padding:
20px 15px;
}
.apt09-trust-item:nth-child(2) {
border-right: none;
}
.apt09-trust-item:nth-child(3) {
border-top:
1px solid #d4d4d1;
}
.apt09-trust-statement {
display: block;
padding:
25px 15px;
}
.apt09-trust-statement strong {
display: block;
margin-top: 15px;
}
}
(function(){
const section =
document.querySelector(‘.apt09’);
if(!section) return;
/* =======================================================
TESTIMONIAL DATA
======================================================== */
const testimonials = [
{
quote:
“APTDEAL made the process feel incredibly straightforward. I wasn’t jumping between endless listings — I finally felt like I was making an informed decision.”,
name:
“Aarav Menon”,
role:
“HOME BUYER”,
property:
“3 BHK Apartment”,
location:
“Bengaluru · Karnataka”,
avatar:
“AM”
},
{
quote:
“Listing our property felt simple, professional and far less complicated than we imagined. The experience gave us much more confidence.”,
name:
“Neha Kapoor”,
role:
“PROPERTY SELLER”,
property:
“Independent Villa”,
location:
“Kochi · Kerala”,
avatar:
“NK”
},
{
quote:
“I was looking for clarity rather than simply more properties. Having the right information made the investment decision much easier.”,
name:
“Rohan Shah”,
role:
“PROPERTY INVESTOR”,
property:
“Investment Apartment”,
location:
“Hyderabad · Telangana”,
avatar:
“RS”
}
];
let current =
0;
/* =======================================================
ELEMENTS
======================================================== */
const quote =
section.querySelector(‘#apt09-main-quote’);
const name =
section.querySelector(‘#apt09-author-name’);
const role =
section.querySelector(‘#apt09-author-role’);
const property =
section.querySelector(‘#apt09-property’);
const location =
section.querySelector(‘#apt09-location’);
const currentNumber =
section.querySelector(‘#apt09-current’);
const avatar =
section.querySelector(‘.apt09-avatar’);
const cards =
section.querySelectorAll(‘.apt09-card’);
const prev =
section.querySelector(‘#apt09-prev’);
const next =
section.querySelector(‘#apt09-next’);
/* =======================================================
UPDATE
======================================================== */
function updateTestimonial(index){
const item =
testimonials[index];
quote.style.opacity = ‘0’;
name.style.opacity = ‘0’;
role.style.opacity = ‘0’;
property.style.opacity = ‘0’;
location.style.opacity = ‘0’;
setTimeout(function(){
quote.textContent =
item.quote;
name.textContent =
item.name;
role.textContent =
item.role;
property.textContent =
item.property;
location.textContent =
item.location;
avatar.textContent =
item.avatar;
currentNumber.textContent =
String(index + 1).padStart(2,’0′);
quote.style.opacity = ‘1’;
name.style.opacity = ‘1’;
role.style.opacity = ‘1’;
property.style.opacity = ‘1’;
location.style.opacity = ‘1’;
},180);
cards.forEach(function(card,i){
card.classList.toggle(
‘apt09-card-active’,
i === index
);
});
current =
index;
}
/* =======================================================
CONTROLS
======================================================== */
next.addEventListener(
‘click’,
function(){
let nextIndex =
current + 1;
if(nextIndex >= testimonials.length){
nextIndex = 0;
}
updateTestimonial(
nextIndex
);
}
);
prev.addEventListener(
‘click’,
function(){
let prevIndex =
current – 1;
if(prevIndex < 0){
prevIndex =
testimonials.length – 1;
}
updateTestimonial(
prevIndex
);
}
);
/* =======================================================
CARD CLICK
======================================================== */
cards.forEach(function(card){
card.addEventListener(
'click',
function(){
const index =
parseInt(
card.getAttribute('data-index'),
10
);
updateTestimonial(index);
}
);
});
/* =======================================================
KEYBOARD
======================================================== */
document.addEventListener(
'keydown',
function(e){
if(!section.matches(':hover'))
return;
if(e.key === 'ArrowRight'){
next.click();
}
if(e.key === 'ArrowLeft'){
prev.click();
}
}
);
/* =======================================================
TEXT TRANSITIONS
======================================================== */
[
quote,
name,
role,
property,
location
].forEach(function(element){
element.style.transition =
'opacity .18s ease';
});
})();
✓ VERIFIED
↗
✓ VERIFIED
↗
✓ VERIFIED
↗