body{
margin:0;
font-family:Poppins;
background:#f4f4f4;
}


/* HEADER */

.header{

height:260px;

background:
linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),
url("https://images.unsplash.com/photo-1521587760476-6c12a4b040da");

background-size:cover;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

color:white;

text-align:center;

}

.header h1{

font-family:Oswald;

font-size:42px;

margin:0;

}

.header p{

color:#ddd;

}



/* MAIN */

.serviceSection{

padding:80px 10%;

}

.container{

display:flex;

gap:80px;

}



/* LEFT */

.left{

width:55%;

}

.left h1{

font-family:Oswald;

font-size:50px;

line-height:60px;

margin-bottom:30px;

}





/* RIGHT */

.right{

width:45%;

display:flex;

gap:20px;

}

.right img{

width:33%;

height:320px;

object-fit:cover;

border-radius:12px;

}



/* RESPONSIVE */

@media(max-width:1000px){

.container{

flex-direction:column;

}

.left{

width:100%;

}

.right{

width:100%;

flex-direction:column;

}

.right img{

width:100%;

height:200px;

}

.left h1{

font-size:30px;

line-height:46px;

}

}
.corporateSection{

padding:0px 10%;

background:white;

}

.corporateContainer{

display:flex;

gap:60px;

align-items:center;

}

.corporateImage{

width:40%;

}

.corporateImage img{

width:100%;

height:320px;

object-fit:cover;

border-radius:12px;

}

.corporateContent{

width:60%;

}

.corporateContent h2{

font-size:32px;

margin-bottom:15px;

font-family:Oswald;

}

.corporateContent p{

color:#555;

line-height:28px;

margin-bottom:15px;

}

.corporatePoints{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:10px;

margin-top:15px;

}

.corporatePoints div{

background:#f7f7f7;

padding:10px;

border-radius:6px;

font-size:14px;

}



/* Responsive */

@media(max-width:900px){

.corporateContainer{

flex-direction:column;

}

.corporateImage{

width:100%;

}

.corporateContent{

width:100%;

}

.corporatePoints{

grid-template-columns:1fr;

}

}
.criminalSection{

padding:70px 10%;

background:#f7f7f7;

}

.criminalContainer{

display:flex;

gap:60px;

align-items:center;

}

.criminalContent{

width:60%;

}

.criminalContent h2{

font-size:32px;

margin-bottom:15px;

font-family:Oswald;

}

.criminalContent p{

color:#555;

line-height:28px;

margin-bottom:15px;

}

.criminalPoints{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:10px;

margin-top:15px;

}

.criminalPoints div{

background:white;

padding:10px;

border-radius:6px;

font-size:14px;

border:1px solid #eee;

}

.criminalImage{

width:40%;

}

.criminalImage img{

width:100%;

height:320px;

object-fit:cover;

border-radius:12px;

}



/* Responsive */

@media(max-width:900px){

.criminalContainer{

flex-direction:column;

}

.criminalContent{

width:100%;

}

.criminalImage{

width:100%;

}

.criminalPoints{

grid-template-columns:1fr;

}

}
.laborSection{

padding:70px 10%;

background:white;

}

.laborContainer{

display:flex;

gap:60px;

align-items:center;

}

.laborImage{

width:40%;

}

.laborImage img{

width:100%;

height:320px;

object-fit:cover;

border-radius:12px;

}

.laborContent{

width:60%;

}

.laborContent h2{

font-size:32px;

margin-bottom:15px;

font-family:Oswald;

}

.laborContent p{

color:#555;

line-height:28px;

margin-bottom:15px;

}

.laborPoints{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:10px;

margin-top:15px;

}

.laborPoints div{

background:#f7f7f7;

padding:10px;

border-radius:6px;

font-size:14px;

}



/* Responsive */

@media(max-width:900px){

.laborContainer{

flex-direction:column;

}

.laborImage{

width:100%;

}

.laborContent{

width:100%;

}

.laborPoints{

grid-template-columns:1fr;

}

}
.civilSection{

padding:70px 10%;

background:#f7f7f7;

}

.civilContainer{

display:flex;

gap:60px;

align-items:center;

}

.civilContent{

width:60%;

}

.civilContent h2{

font-size:32px;

margin-bottom:15px;

font-family:Oswald;

}

.civilContent p{

color:#555;

line-height:28px;

margin-bottom:15px;

}

.civilPoints{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:10px;

margin-top:15px;

}

.civilPoints div{

background:white;

padding:10px;

border-radius:6px;

font-size:14px;

border:1px solid #eee;

}

.civilImage{

width:40%;

}

.civilImage img{

width:100%;

height:320px;

object-fit:cover;

border-radius:12px;

}



/* Responsive */

@media(max-width:900px){

.civilContainer{

flex-direction:column;

}

.civilContent{

width:100%;

}

.civilImage{

width:100%;

}

.civilPoints{

grid-template-columns:1fr;

}

}
.familySection{

padding:70px 10%;

background:white;

}

.familyContainer{

display:flex;

gap:60px;

align-items:center;

}

.familyImage{

width:40%;

}

.familyImage img{

width:100%;

height:320px;

object-fit:cover;

border-radius:12px;

}

.familyContent{

width:60%;

}

.familyContent h2{

font-size:32px;

margin-bottom:15px;

font-family:Oswald;

}

.familyContent p{

color:#555;

line-height:28px;

margin-bottom:15px;

}

.familyPoints{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:10px;

margin-top:15px;

}

.familyPoints div{

background:#f7f7f7;

padding:10px;

border-radius:6px;

font-size:14px;

}



/* Responsive */

@media(max-width:900px){

.familyContainer{

flex-direction:column;

}

.familyImage{

width:100%;

}

.familyContent{

width:100%;

}

.familyPoints{

grid-template-columns:1fr;

}

}
.ipSection{

padding:70px 10%;

background:#f7f7f7;

}

.ipContainer{

display:flex;

gap:60px;

align-items:center;

}

.ipContent{

width:60%;

}

.ipContent h2{

font-size:32px;

margin-bottom:15px;

font-family:Oswald;

}

.ipContent p{

color:#555;

line-height:28px;

margin-bottom:15px;

}

.ipPoints{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:10px;

margin-top:15px;

}

.ipPoints div{

background:white;

padding:10px;

border-radius:6px;

font-size:14px;

border:1px solid #eee;

}

.ipImage{

width:40%;

}

.ipImage img{

width:100%;

height:320px;

object-fit:cover;

border-radius:12px;

}



/* Responsive */

@media(max-width:900px){

.ipContainer{

flex-direction:column;

}

.ipContent{

width:100%;

}

.ipImage{

width:100%;

}

.ipPoints{

grid-template-columns:1fr;

}

}
/* POPUP */

.popup{

position:fixed;

top:0;

left:0;

width:100%;

height:100%;

background:rgba(0,0,0,0.7);

display:none;

align-items:center;

justify-content:center;

z-index:2000;

}

/* CONTENT */

.popupContent{

background:white;

padding:35px;

width:400px;

border-radius:8px;

position:relative;

animation:popup .3s;

}

@keyframes popup{

from{transform:scale(.8);}

to{transform:scale(1);}

}

.popupContent h2{

margin-top:0;

font-family:Montserrat;

}

/* CLOSE */

.closeBtn{

position:absolute;

right:15px;

top:10px;

font-size:20px;

cursor:pointer;

}

/* FORM */

.popupContent input,
.popupContent select,
.popupContent textarea{

width:100%;

padding:10px;

margin:8px 0;

border:1px solid #ddd;

font-family:Open Sans;

}

.popupContent textarea{

height:90px;

resize:none;

}

.bookBtn{

width:100%;

background:black;

color:white;

border:none;

padding:12px;

cursor:pointer;

margin-top:10px;

transition:.3s;

}

.bookBtn:hover{

background:#C8A96A;

}

/* MOBILE */

@media(max-width:500px){

.popupContent{

width:90%;

}

}
/* GLOBAL RESPONSIVE DESIGN */

/* TABLET */
@media (max-width:992px){

.container,
.corporateContainer,
.criminalContainer,
.laborContainer,
.civilContainer,
.familyContainer,
.ipContainer{
flex-direction:column;
gap:30px;
}

.left,
.right,
.corporateContent,
.criminalContent,
.laborContent,
.civilContent,
.familyContent,
.ipContent,
.corporateImage,
.criminalImage,
.laborImage,
.civilImage,
.familyImage,
.ipImage{
width:100%;
}

.right{
flex-direction:column;
}

.right img{
width:100%;
height:220px;
}

.corporateImage img,
.criminalImage img,
.laborImage img,
.civilImage img,
.familyImage img,
.ipImage img{
height:240px;
}

.corporatePoints,
.criminalPoints,
.laborPoints,
.civilPoints,
.familyPoints,
.ipPoints{
grid-template-columns:1fr;
}

}

/* MOBILE */
@media (max-width:600px){

.serviceSection,
.corporateSection,
.criminalSection,
.laborSection,
.civilSection,
.familySection,
.ipSection{
padding:50px 20px;
text-align:center;
}

.header{
height:200px;
padding:20px;
}

.header h1{
font-size:28px;
}

.header p{
font-size:14px;
}

.left h1{
font-size:28px;
line-height:40px;
}

.corporateContent h2,
.criminalContent h2,
.laborContent h2,
.civilContent h2,
.familyContent h2,
.ipContent h2{
font-size:24px;
}

.corporateContent p,
.criminalContent p,
.laborContent p,
.civilContent p,
.familyContent p,
.ipContent p{
font-size:14px;
line-height:24px;
}

.right img,
.corporateImage img,
.criminalImage img,
.laborImage img,
.civilImage img,
.familyImage img,
.ipImage img{
height:180px;
}

}

/* SMALL MOBILE */

@media (max-width:480px){

.header h1{
font-size:24px;
}

.left h1{
font-size:24px;
}

.corporateContent h2,
.criminalContent h2,
.laborContent h2,
.civilContent h2,
.familyContent h2,
.ipContent h2{
font-size:22px;
}

.right img,
.corporateImage img,
.criminalImage img,
.laborImage img,
.civilImage img,
.familyImage img,
.ipImage img{
height:160px;
}

}