*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
scroll-behavior:smooth;
}

body{
background:#ffffff;
color:#222;
overflow-x:hidden;
}

/* HEADER */

.header{
width:100%;
padding:20px 7%;
background:#fff;
display:flex;
justify-content:space-between;
align-items:center;
position:fixed;
top:0;
left:0;
z-index:1000;
box-shadow:0 3px 15px rgba(0,0,0,.08);
}

.logo-area{
display:flex;
align-items:center;
gap:15px;
}

.logo-area img{
width:75px;
height:auto;
}

.logo-area h1{
font-size:24px;
color:#4d148c;
font-weight:800;
line-height:1.1;
}

.logo-area p{
font-size:13px;
color:#666;
margin-top:3px;
}

nav ul{
display:flex;
gap:35px;
list-style:none;
}

nav ul li a{
text-decoration:none;
color:#222;
font-weight:600;
font-size:15px;
transition:.3s;
position:relative;
}

nav ul li a:hover{
color:#6c2bd9;
}

nav ul li a::after{
content:'';
position:absolute;
left:0;
bottom:-6px;
width:0%;
height:2px;
background:#6c2bd9;
transition:.3s;
}

nav ul li a:hover::after{
width:100%;
}

/* HERO SECTION */

.hero{
height:100vh;
background:url('https://images.unsplash.com/photo-1504307651254-35680f356dfd?q=80&w=1920&auto=format&fit=crop');
background-size:cover;
background-position:center;
position:relative;
display:flex;
align-items:center;
padding:0 8%;
margin-top:90px;
}

.overlay{
position:absolute;
width:100%;
height:100%;
background:linear-gradient(to right,rgba(76,0,130,.92),rgba(76,0,130,.55));
left:0;
top:0;
}

.hero-content{
position:relative;
z-index:2;
max-width:760px;
color:white;
}

.hero-content h4{
letter-spacing:4px;
margin-bottom:20px;
font-weight:500;
font-size:15px;
}

.hero-content h2{
font-size:72px;
line-height:1.1;
margin-bottom:25px;
font-weight:800;
}

.hero-content p{
font-size:18px;
line-height:1.9;
margin-bottom:40px;
max-width:650px;
}

.hero-buttons{
display:flex;
gap:20px;
flex-wrap:wrap;
}

.btn{
padding:16px 35px;
background:white;
color:#4d148c;
text-decoration:none;
font-weight:700;
border-radius:6px;
display:inline-block;
transition:.3s;
}

.btn:hover{
transform:translateY(-5px);
}

.btn-outline{
padding:16px 35px;
border:2px solid white;
color:white;
text-decoration:none;
font-weight:700;
border-radius:6px;
display:inline-block;
transition:.3s;
}

.btn-outline:hover{
background:white;
color:#4d148c;
}

/* GLOBAL SECTION */

section{
padding:100px 8%;
}

/* ABOUT SECTION */

.about-section{
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
align-items:center;
}

.about-left h5,
.section-title h5{
color:#6c2bd9;
letter-spacing:3px;
margin-bottom:15px;
font-size:14px;
font-weight:700;
}

.about-left h2,
.section-title h2{
font-size:52px;
margin-bottom:25px;
line-height:1.2;
color:#222;
font-weight:800;
}

.about-left p{
line-height:1.9;
margin-bottom:20px;
color:#555;
font-size:16px;
}

.purple-btn{
display:inline-block;
padding:15px 30px;
background:#6c2bd9;
color:white;
text-decoration:none;
border-radius:6px;
margin-top:10px;
font-weight:600;
transition:.3s;
}

.purple-btn:hover{
background:#4d148c;
}

.about-right{
display:grid;
grid-template-columns:1fr;
gap:25px;
}

.stat-box{
background:#f7f2ff;
padding:45px;
border-radius:12px;
transition:.3s;
}

.stat-box:hover{
transform:translateY(-8px);
}

.stat-box h1{
font-size:55px;
color:#6c2bd9;
margin-bottom:10px;
font-weight:800;
}

.stat-box p{
font-size:16px;
color:#444;
}

/* SERVICES */

.services{
background:#fafafa;
}

.section-title{
text-align:center;
margin-bottom:70px;
}

.service-grid,
.objective-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:30px;
}

.service-card,
.objective-card{
background:white;
padding:45px;
border-radius:12px;
box-shadow:0 5px 20px rgba(0,0,0,.08);
transition:.3s;
border-bottom:4px solid transparent;
}

.service-card:hover,
.objective-card:hover{
transform:translateY(-10px);
border-bottom:4px solid #6c2bd9;
}

.service-card h3,
.objective-card h3{
font-size:25px;
margin-bottom:20px;
color:#4d148c;
font-weight:700;
}

.service-card p,
.objective-card p{
line-height:1.9;
color:#555;
font-size:15px;
}

/* OBJECTIVES */

.objectives{
background:#4d148c;
}

.white h5,
.white h2{
color:white;
}

.objective-card{
background:white;
}

/* CONTACT CTA */

.contact-banner{
background:#f7f2ff;
text-align:center;
padding:120px 8%;
}

.contact-banner h2{
font-size:55px;
margin-bottom:20px;
color:#4d148c;
font-weight:800;
}

.contact-banner p{
max-width:700px;
margin:auto;
line-height:1.9;
margin-bottom:35px;
color:#555;
font-size:17px;
}

/* PAGE HERO */

.page-hero{
height:60vh;
background:url('https://images.unsplash.com/photo-1504307651254-35680f356dfd?q=80&w=1920&auto=format&fit=crop');
background-size:cover;
background-position:center;
position:relative;
display:flex;
justify-content:center;
align-items:center;
text-align:center;
margin-top:90px;
}

.page-hero-content{
position:relative;
z-index:2;
color:white;
}

.page-hero-content h1{
font-size:65px;
margin-bottom:20px;
font-weight:800;
}

.page-hero-content p{
font-size:20px;
}

/* CONTACT PAGE */

.contact-page{
background:#f7f7fb;
padding:120px 8%;
}

.contact-container{
display:grid;
grid-template-columns:1fr 1.1fr;
gap:60px;
align-items:start;
}

/* CONTACT INFO */

.contact-info-side h5{
color:#6c2bd9;
letter-spacing:3px;
margin-bottom:15px;
font-size:14px;
font-weight:700;
}

.contact-info-side h2{
font-size:50px;
line-height:1.2;
margin-bottom:25px;
font-weight:800;
color:#222;
}

.contact-info-side p{
line-height:1.9;
color:#555;
margin-bottom:35px;
font-size:16px;
}

.contact-box{
background:white;
padding:30px;
border-radius:14px;
margin-bottom:20px;
box-shadow:0 5px 20px rgba(0,0,0,.06);
border-left:5px solid #6c2bd9;
transition:.3s;
}

.contact-box:hover{
transform:translateY(-5px);
}

.contact-box h3{
margin-bottom:10px;
color:#4d148c;
font-size:22px;
}

/* MODERN FORM */

.modern-contact-form{
background:white;
padding:60px;
border-radius:20px;
box-shadow:0 10px 40px rgba(0,0,0,.08);
position:relative;
overflow:hidden;
}

.modern-contact-form::before{
content:'';
position:absolute;
top:0;
left:0;
width:100%;
height:6px;
background:linear-gradient(to right,#6c2bd9,#4d148c);
}

.form-top{
margin-bottom:40px;
}

.form-top h5{
color:#6c2bd9;
letter-spacing:3px;
font-size:14px;
margin-bottom:15px;
font-weight:700;
}

.form-top h2{
font-size:45px;
color:#222;
margin-bottom:15px;
font-weight:800;
line-height:1.2;
}

.form-top p{
color:#666;
font-size:16px;
line-height:1.8;
}

.form-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:25px;
}

.form-group{
display:flex;
flex-direction:column;
margin-bottom:20px;
}

.form-group label{
margin-bottom:10px;
font-weight:600;
font-size:15px;
color:#333;
}

.form-group input,
.form-group textarea{
padding:18px;
border:1px solid #ddd;
border-radius:10px;
font-size:15px;
background:#fafafa;
outline:none;
transition:.3s;
}

.form-group input:focus,
.form-group textarea:focus{
border-color:#6c2bd9;
background:white;
box-shadow:0 0 15px rgba(108,43,217,.15);
}

.form-group textarea{
resize:none;
}

.modern-contact-form button{
width:100%;
padding:18px;
border:none;
border-radius:10px;
background:linear-gradient(to right,#6c2bd9,#4d148c);
color:white;
font-size:16px;
font-weight:700;
cursor:pointer;
transition:.3s;
margin-top:10px;
}

.modern-contact-form button:hover{
transform:translateY(-4px);
box-shadow:0 10px 25px rgba(108,43,217,.3);
}

/* FOOTER */

footer{
background:#1f0936;
color:white;
}

.footer-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:50px;
padding:80px 8%;
}

.footer-grid h3{
margin-bottom:20px;
font-size:22px;
}

.footer-grid p,
.footer-grid li{
line-height:2;
color:#ddd;
font-size:15px;
}

.footer-grid ul{
list-style:none;
}

.footer-grid a{
text-decoration:none;
color:#ddd;
transition:.3s;
}

.footer-grid a:hover{
color:white;
}

.footer-bottom{
border-top:1px solid rgba(255,255,255,.1);
padding:25px;
text-align:center;
font-size:14px;
}

/* MOBILE */

@media(max-width:992px){

.header{
flex-direction:column;
gap:20px;
padding:20px;
}

nav ul{
flex-wrap:wrap;
justify-content:center;
gap:20px;
}

.hero{
padding:0 5%;
}

.hero-content h2{
font-size:48px;
}

.about-section{
grid-template-columns:1fr;
}

.about-left h2,
.section-title h2,
.contact-info-side h2{
font-size:40px;
}

.contact-container{
grid-template-columns:1fr;
}

.form-row{
grid-template-columns:1fr;
}

.modern-contact-form{
padding:35px;
}

.form-top h2{
font-size:35px;
}

.contact-banner h2{
font-size:42px;
}

.page-hero-content h1{
font-size:45px;
}

}

@media(max-width:600px){

.hero-content h2{
font-size:38px;
}

.hero-content p{
font-size:16px;
}

.hero-buttons{
flex-direction:column;
}

.btn,
.btn-outline{
width:100%;
text-align:center;
}

.about-left h2,
.section-title h2,
.contact-info-side h2{
font-size:32px;
}

.contact-banner h2{
font-size:35px;
}

.page-hero-content h1{
font-size:35px;
}

.modern-contact-form{
padding:25px;
}

}