/* 
*
* USER STYLES
* This styles will override default styles of template
*
*/

.hero-section{
height:750px;
background-size:cover;
background-position:center;
position:relative;
}

.hero-overlay{
background:linear-gradient(
90deg,
rgba(0,0,0,0.65) 0%,
rgba(0,0,0,0.55) 35%,
rgba(0,0,0,0.25) 50%,
rgba(0,0,0,0.0) 70%
);
height:100%;
display:flex;
align-items:center;
}

.hero-title{
color:#fff;
font-size:56px;
font-weight:700;
}

.hero-subtitle{
color:#fff;
font-size:22px;
}

.services-title{
text-align:center;
font-size:36px;
font-weight:700;
margin-bottom:60px;
}

.service-card{
background:#f5f5f5;
padding:40px;
margin-bottom:30px;
text-align:center;
transition:0.3s;
}

.service-card:hover{
background:#1fa6c4;
color:white;
}

.service-icon{
font-size:40px;
color:#1fa6c4;
margin-bottom:20px;
}

.service-card:hover .service-icon{
color:white;
}

.service-title{
font-size:22px;
margin-bottom:15px;
}

.services-title:after{
content:"";
display:block;
width:60px;
height:3px;
background:#f4b400;
margin:15px auto 0;
}

.service-text{
font-size:15px;
margin-bottom:20px;
}

.service-more{
color:#f4b400;
font-weight:bold;
text-decoration:none;
}

.box.box-landing-1 .row{
margin-top:50px !important;
}

.box.box-landing-1 .box__caption{
text-align:center;
font-size:36px !important;
font-weight:700;
margin-bottom:60px !important;
}

.box.box-landing-1 .box__caption{
display:block;
text-align:center;
line-height: 100px;
}


/* FIX NAVBAR */

.header {
    position: sticky;
    top: 0;
    z-index: 9999;
}

.navbar {
    background: #ffffff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
}

.events-section{
padding:60px 0;
}

.events-title{
font-size:32px;
margin-bottom:40px;
font-weight:600;
}

.events-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;
}

.event-card{
background:white;
border-radius:10px;
overflow:hidden;
box-shadow:0 10px 25px rgba(0,0,0,0.08);
transition:0.25s;
display:flex;
flex-direction:column;
height:100%;
}

.event-card:hover{
transform:translateY(-6px);
box-shadow:0 20px 40px rgba(0,0,0,0.15);
}

.event-image img{
width:100%;
height:200px;
object-fit:cover;
}

.event-content{
padding:20px;
flex:1;
display:flex;
flex-direction:column;
}

.event-title{
font-size:18px;
font-weight:600;
margin-bottom:10px;
}

.event-meta{
font-size:13px;
color:#666;
margin-bottom:12px;
display:flex;
flex-direction:column;
gap:3px;
}

.event-desc{
font-size:14px;
color:#444;
margin-bottom:20px;
flex:1;
}

.event-btn{
color:#f59e0b;
font-weight:600;
text-decoration:none;
}

.events-more{
text-align:center;
margin-top:40px;
}

.events-more-btn{
background:#f59e0b;
color:white;
padding:12px 25px;
border-radius:6px;
font-weight:600;
text-decoration:none;
}

.event-hero{
width:100%;
margin-bottom:40px;
}

.event-hero-image img{
width:100%;
height:420px;
object-fit:cover;
}

.event-container{
max-width:900px;
margin:auto;
padding:40px 20px;
}

.event-title{
font-size:38px;
font-weight:700;
margin-bottom:20px;
}

.event-meta{
display:flex;
gap:30px;
margin-bottom:30px;
color:#555;
font-size:15px;
}

.event-description{
font-size:17px;
line-height:1.7;
color:#333;
margin-bottom:40px;
}

.event-actions{
display:flex;
gap:20px;
flex-wrap:wrap;
}

.event-button-primary{
background:#f59e0b;
color:white;
padding:12px 28px;
border-radius:6px;
font-weight:600;
text-decoration:none;
}

.event-button-secondary{
border:1px solid #ddd;
padding:12px 28px;
border-radius:6px;
text-decoration:none;
color:#333;
}


#event-signup-modal{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
display:flex;
align-items:center;
justify-content:center;
z-index:9999;
}

#event-signup-modal.hidden{
display:none;
}

.event-modal{
background:white;
padding:40px;
border-radius:12px;
max-width:400px;
width:90%;
box-shadow:0 20px 60px rgba(0,0,0,0.3);
text-align:center;
}

.event-success-card{

background:white;
padding:40px;
border-radius:14px;
max-width:420px;
width:90%;
text-align:center;

box-shadow:0 25px 70px rgba(0,0,0,0.4);

animation:eventSuccessPop 0.35s ease;

}

@keyframes eventSuccessPop{

from{
transform:scale(0.85);
opacity:0;
}

to{
transform:scale(1);
opacity:1;
}

}

.event-success-card img{

margin-top:20px;

}

.icon-badge{

position:absolute;
top:-6px;
right:-6px;

background:#e53935;
color:white;

font-size:12px;
font-weight:bold;

padding:4px 7px;
border-radius:20px;

}

.icon-badge.hidden{
display:none;
}

.feature-image{
    height:220px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.feature-image img{
    max-height:200px;
    width:auto;
}

.feature-title{
    font-size:20px;
    font-weight:600;
    text-align: center;
}

.feature-text{
    color:#666;
    text-align: center;
}