/* Extracted from index.php */

.hero{
background:linear-gradient(135deg,#0b5ed7,#0dcaf0);
padding:130px 0;
color:white;
position:relative;
overflow:hidden;
}

.hero:before{
content:"";
position:absolute;
width:500px;
height:500px;
background:rgba(255,255,255,.08);
border-radius:50%;
right:-150px;
top:-150px;
}

.hero .container{
position:relative;
z-index:1;
}

.hero h1{
text-shadow:0 3px 10px rgba(0,0,0,.35);
}

.hero .lead{
max-width:800px;
margin-left:auto;
margin-right:auto;
}

.btn{
border-radius:30px;
padding:12px 30px;
font-weight:600;
}

.service-card{
border:none;
border-radius:15px;
transition:.3s;
box-shadow:0 5px 20px rgba(0,0,0,.08);
}

.service-card:hover{
transform:translateY(-8px);
}

.icon{
font-size:48px;
color:#0d6efd;
margin-bottom:20px;
}

.section-title{
font-weight:bold;
margin-bottom:40px;
}

.cta{
background:#0d6efd;
color:white;
padding:80px 0;
}

footer{
background:#0b1d30;
color:#fff;
padding:30px 0;
}

.service-scroll-wrapper{
width:100%;
overflow:hidden;
}

.service-scroll{
display:flex;
width:max-content;
gap:25px;
animation:serviceRoll 25s linear infinite;
}

.service-scroll:hover{
animation-play-state:paused;
}

.scroll-card{
width:280px;
background:white;
padding:30px;
border-radius:15px;
box-shadow:0 5px 20px rgba(0,0,0,.08);
text-align:center;
flex-shrink:0;
}

.scroll-card i{
font-size:42px;
margin-bottom:15px;
}

.scroll-card:nth-child(1) i,
.scroll-card:nth-child(9) i{
color:#0d6efd;
}

.scroll-card:nth-child(2) i,
.scroll-card:nth-child(10) i{
color:#20c997;
}

.scroll-card:nth-child(3) i,
.scroll-card:nth-child(11) i{
color:#dc3545;
}

.scroll-card:nth-child(4) i,
.scroll-card:nth-child(12) i{
color:#6f42c1;
}

.scroll-card:nth-child(5) i,
.scroll-card:nth-child(13) i{
color:#fd7e14;
}

.scroll-card:nth-child(6) i,
.scroll-card:nth-child(14) i{
color:#198754;
}

.scroll-card:nth-child(7) i{
color:#0dcaf0;
}

.scroll-card:nth-child(8) i{
color:#ffc107;
}

.scroll-card:nth-child(15) i{
color:#e83e8c;
}

@keyframes serviceRoll{
from{
transform:translateX(0);
}
to{
transform:translateX(-50%);
}
}

.stats-box{
text-align:center;
padding:30px;
background:white;
border-radius:15px;
box-shadow:0 5px 20px rgba(0,0,0,.08);
}

.stats-box h3{
font-size:38px;
font-weight:bold;
color:#0d6efd;
}

.testimonial-card{
background:white;
padding:30px;
height:100%;
border-radius:15px;
box-shadow:0 5px 20px rgba(0,0,0,.08);
}

.process-card{
text-align:center;
padding:25px;
background:white;
border-radius:15px;
height:100%;
box-shadow:0 5px 20px rgba(0,0,0,.08);
position:relative;
}

.process-number{
width:55px;
height:55px;
border-radius:50%;
background:#0d6efd;
color:white;
display:flex;
align-items:center;
justify-content:center;
font-size:24px;
font-weight:bold;
margin:0 auto 20px;
}

/* Chat Floating Button & Widget */
.chat-float-btn{
position:fixed;
right:25px;
bottom:25px;
width:60px;
height:60px;
border-radius:50%;
background:#0d6efd;
color:white;
display:flex;
align-items:center;
justify-content:center;
font-size:26px;
box-shadow:0 5px 20px rgba(0,0,0,.25);
cursor:pointer;
z-index:9999;
}

.chat-widget{
display:none;
position:fixed;
right:25px;
bottom:95px;
width:380px;
height:520px;
background:white;
border-radius:15px;
box-shadow:0 5px 25px rgba(0,0,0,.3);
z-index:9999;
overflow:hidden;
}

.chat-widget iframe{
width:100%;
height:100%;
border:0;
}
.chat-close{
position:absolute;
right:10px;
top:8px;
width:32px;
height:32px;
border:none;
border-radius:50%;
background:#dc3545;
color:white;
font-size:22px;
line-height:28px;
cursor:pointer;
z-index:10000;
}

/* Homepage hero text protection */
.hero h1,
.hero h2,
.hero h3 {
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
}

.hero .lead {
    color:rgba(255,255,255,.95) !important;
}