/* ================= HERO SECTION ================= */

.about-hero{
padding-top:50px;
padding-bottom:40px;
}

.about-title{
font-size:16px;
letter-spacing:2px;
color:#212020;
margin-bottom:10px;
font-weight:500;
text-align:center;
}

.about-heading{
font-size:48px;
font-weight:600;
color:#212020;
margin-bottom:10px;
text-align:center;
}

.about-subheading{
font-size:16px;
color:#4a4a4a;
max-width:620px;
margin:auto;
line-height:1.6;
text-align:center;
}

.about-hero img{
margin-top:35px;
width:100%;
height:auto;
display:block;
}


/* ================= ABOUT SECTION ================= */

.about-section,
.beginning-section{
padding:80px 0;
}

.about-container{
width:90%;
max-width:1200px;
margin:auto;
}

.about-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
align-items:center;
}

.about-section h2,
.beginning-section h2{
font-size:34px;
font-weight:700;
letter-spacing:1px;
margin-bottom:30px;
}

.about-text p,
.beginning-text p{
font-size:18px;
line-height:1.6;
color:#333;
margin-bottom:20px;
}

.about-image img{
width:100%;
height:auto;
display:block;
}


/* ================= BEGINNING SECTION ================= */

.beginning-images{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px;
}

.beginning-images img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}

/* ================= OUR GROWTH SECTION ================= */

.growth-section{
padding:40px 0;
}


/* HEADER */

.growth-header{
max-width:650px;
margin:0 auto 60px auto;
}

.growth-title{
font-family:'Open Sans',sans-serif;
font-size:32px;
font-weight:700;
color:#191919;
letter-spacing:1px;
margin-bottom:20px;
}

.growth-subtitle{
font-family:'Open Sans',sans-serif;
font-size:20px;
color:#0E0E0E;
line-height:1.6;
}


/* STATS GRID */

.growth-stats{
display:grid;
grid-template-columns:repeat(5,1fr);
gap:40px;
text-align:center;
margin-bottom:60px;
}


/* STAT */

.stat-number{
font-family:'Open Sans',sans-serif;
font-size:32px;
font-weight:600;
color:#191919;
margin-bottom:16px;
}

.stat-number span{
font-size:16px;
font-weight:400;
}

.stat-text{
font-size:16px;
color:#333;
line-height:1.5;
}


/* IMAGE */

.growth-image img{
width:100%;
display:block;
}

.solutions .exp-icon{
font-size:22px;
font-weight:300;
transition:0.3s;
}

.solutions > div.active .exp-icon{
transform:rotate(45deg);
}

/* ================= EXPERIENCE SECTION ================= */

.solutions figure{
width:16px;
height:16px;
position:relative;
display:flex;
align-items:center;
justify-content:center;
}

/* horizontal line */
.solutions figure:before{
content:"";
position:absolute;
width:12px;
height:1px;
background:#000;
}

/* vertical line */
.solutions figure:after{
content:"";
position:absolute;
width:1px;
height:12px;
background:#000;
}



/* FAQ SECTION */

.faq-section{
    padding:20px 0 100px;
}

.faq-image{
padding-right:60px;
}

.faq-title{
font-size:18px;
font-weight:600;
letter-spacing:1px;
margin-bottom:35px;
}

.faq-item{
border-bottom:1px solid #ddd;
padding:8px 0;
}


.faq-question{
display:flex;
justify-content:space-between;
align-items:center;
cursor:pointer;
font-size:15px;
font-weight:500;
color:#111;
}


.faq-icon{
font-size:22px;
font-weight:300;
}


.faq-answer{
display:none;
padding-top:12px;
font-size:14px;
color:#444;
line-height:1.7;
max-width:520px;
}


.faq-item.active .faq-answer{
display:block;
}

.faq-item.active .faq-icon{
transform:rotate(45deg);
}


.faq-image img{
width:100%;
border-radius:4px;
}


/* ================= MOBILE RESPONSIVE ================= */

@media (max-width:768px){

.about-heading{
font-size:34px;
}

.about-subheading{
font-size:14px;
}

.about-section,
.beginning-section{
padding:20px 0;
}

.about-row{
grid-template-columns:1fr;
gap:30px;
}

/* swap image and text order */

.beginning-section .about-row{
flex-direction:column;
}

.beginning-text{
order:1;
}

.beginning-images{
order:2;
grid-template-columns:1fr;
gap:15px;
}

.beginning-images img{
width:100%;
height:auto;
object-fit:cover;
}
.growth-header{
text-align:left;
}

.growth-section{
    padding:20px 10px;
}
.growth-stats{
grid-template-columns:1fr;
text-align:left;
}

.stat-number{
font-size:28px;
}

.growth-title{
font-size:34px;
text-align:left;
}

.growth-subtitle{
font-size:16px;
text-align:left;
}
.experience-section {
    padding:10px 0px;
}
.experience-slider{
    height:320px;
}

.experience-slider .item{
    height:320px;
}

.experience-content{
   padding:0px 20px;
    margin-top:30px;
}
.faq-image{
padding-right:0;
margin-bottom:40px;
}

.faq-section{
padding:70px 0;
}

}


/* ================= NAVBAR FIX ================= */

.navbar-toggler{
border:none;
outline:none;
}

.navbar-light .navbar-toggler-icon{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,0,0,0.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* FOOTER */

.footer-section{

padding:60px 0 40px;
font-size:14px;
color:#444;
}

.footer-logo{
width:160px;
margin-bottom:15px;
}

.footer-links h5,
.footer-contact h5{
font-weight:600;
margin-bottom:15px;
}

.footer-links ul{
list-style:none;
padding:0;
margin:0;
}

.footer-links li{
margin-bottom:8px;
}

.footer-links a{
color:#333;
text-decoration:none;
}

.footer-links a:hover{
text-decoration:underline;
}

.footer-contact p{
line-height:1.6;
}

.footer-award{
text-align:left;
}

.award-img{

margin-bottom:15px;
}

.footer-social a{
margin-right:12px;
font-size:18px;
color:#333;
}

.footer-line{
margin:40px 0 20px;
}

.footer-bottom-links{
text-align:center;
font-size:13px;
margin-bottom:10px;
}

.footer-bottom-links a{
color:#666;
margin:0 6px;
}

.footer-copy{
text-align:center;
font-size:13px;
color:#777;
}