.quote-hero{

padding:100px 8%;

text-align:center;

background:
linear-gradient(
135deg,
#0d47a1,
#2b6ee5
);

color:white;

}

.quote-hero h1{

font-size:55px;

margin-bottom:15px;

}

.quote-hero p{

font-size:18px;

opacity:.9;

}



.quote-container{

padding:90px 8%;

display:grid;

grid-template-columns:
2fr 1fr;

gap:40px;

}



.quote-form{

background:white;

padding:40px;

border-radius:25px;

display:flex;

flex-direction:column;

gap:18px;

box-shadow:
0 10px 35px rgba(0,0,0,.08);

}



.quote-form input,
.quote-form select,
.quote-form textarea{

padding:16px;

border:1px solid #ddd;

border-radius:12px;

outline:none;

font-size:15px;

}



.quote-form button{

background:#0d47a1;

color:white;

padding:18px;

border:none;

border-radius:12px;

font-size:16px;

font-weight:bold;

cursor:pointer;

transition:.3s;

}

.quote-form button:hover{

background:#09377f;

}



.quote-side{

display:flex;

flex-direction:column;

gap:25px;

}



.quote-card,
.quote-contact{

background:white;

padding:35px;

border-radius:25px;

box-shadow:
0 10px 35px rgba(0,0,0,.08);

}



.quote-card h2{

margin-bottom:20px;

}



.quote-card ul{

list-style:none;

line-height:2;

}



.quote-contact{

text-align:center;

}



.quote-contact a{

display:inline-block;

margin-top:15px;

padding:12px 20px;

background:#25D366;

color:white;

text-decoration:none;

border-radius:12px;

font-weight:bold;

}



@media(max-width:900px){

.quote-container{

grid-template-columns:1fr;

padding:64px 6%;

}

.quote-hero{

padding:76px 6%;

}

.quote-hero h1{

font-size:42px;

}

}

@media(max-width:560px){

.quote-hero{

padding:62px 6%;

}

.quote-hero h1{

font-size:34px;

}

.quote-hero p{

font-size:16px;

}

.quote-container{

padding:52px 6%;

}

.quote-form,
.quote-card,
.quote-contact{

padding:26px;

border-radius:18px;

}

}