body{


margin:0;

padding:0;

font-family:'Prompt',sans-serif;

background:var(--body-bg);

color:var(--text);

overflow-x:hidden;


}

a{


text-decoration:none;

color:var(--link);

transition:.3s;


}

a:hover{


color:var(--link-hover);


}

img{


max-width:100%;

display:block;


}

.section{


padding:15px 0;

background:var(--section-bg);


}

.section-alt{


padding:80px 0;

background:var(--section-alt-bg);


}

.section-title{


margin-bottom:15px;

font-size:36px;

font-weight:700;

color:var(--heading);


}

.section-subtitle{

margin-bottom:40px;

color:var(--text-light);


}

.theme-card{


background:var(--card-bg);

border:1px solid var(--border);

border-radius:16px;

overflow:hidden;

box-shadow:var(--shadow-sm);

transition:.3s;


}

.theme-card:hover{


transform:translateY(-5px);

box-shadow:var(--shadow-md);


}

/*
|--------------------------------------------------------------------------
| Province Card
|--------------------------------------------------------------------------
*/

.province-body{

    padding:12px;

    min-height:60px;

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;

}

.province-body h3{

    margin:0;

    font-size:16px;

    font-weight:600;

    line-height:1.4;

}
/*
|--------------------------------------------------------------------------
| Include Category
|--------------------------------------------------------------------------
*/

.inc-category-image{

    height:220px;

    overflow:hidden;

}

.inc-category-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;

}

    .inc-category-body{

    min-height:50px;

    padding:10px;

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;

}

.inc-category-body h5{

    margin:0;

    font-size:16px;

    font-weight:600;

    line-height:1.4;

}

| /*                                                                         |
| -------------------------------------------------------------------------- |
| Member Dropdown                                                            |
| -------------------------------------------------------------------------- |
| */                                                                         |

.member-dropdown{


position:relative;


}

.member-dropdown-menu{


display:none;

position:absolute;

top:100%;

right:0;

min-width:180px;

background:#ffffff;

border-radius:10px;

box-shadow:0 5px 20px rgba(0,0,0,.15);

overflow:hidden;

z-index:9999;


}

.member-dropdown-menu{
    display:none;
}

.member-dropdown-menu.show{
    display:block;
}
.member-dropdown-menu a{


display:block;

padding:12px 15px;

color:#333;

text-decoration:none;

transition:.2s;


}

.member-dropdown-menu a:hover{


background:#f5f5f5;

color:#0d6efd;


}

.driver-menu-icon{

    width:120px;
    height:120px;

    margin:auto;

    border:2px solid var(--border);

    border-radius:20px;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:48px;

    color:var(--heading);

    background:var(--card-bg);

    transition:.3s;

}

.driver-menu-icon:hover{

    border-color:var(--heading);

    color:var(--heading);

    transform:translateY(-5px);

    box-shadow:var(--shadow-md);

}
.social-follow-card{

    border-radius:20px;

}

.social-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:15px 0;

    border-bottom:1px solid #eee;

}

.social-row:last-child{

    border-bottom:none;

}

.social-left{

    display:flex;

    align-items:center;

    gap:15px;

}

.social-left i{

    font-size:38px;

}

.social-left .fa-facebook,
.social-left .fab.fa-facebook{

    color:#1877f2;

}

.social-left .fa-youtube,
.social-left .fab.fa-youtube{

    color:#ff0000;

}

.social-left .fa-tiktok,
.social-left .fab.fa-tiktok{

    color:#000;

}

.social-left .fa-line,
.social-left .fab.fa-line{

    color:#00c300;

}

.hero-category-menu{

    display:flex;

    justify-content:center;

    flex-wrap:wrap;

    gap:15px;

    margin-top:20px;

    margin-bottom:20px;

}

.hero-category-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    min-width:160px;

    padding:12px 25px;

    border-radius:50px;

    text-decoration:none;

    font-weight:600;

    transition:.3s;

    background:var(--card-bg);

    color:var(--heading);

    border:1px solid var(--border);

    box-shadow:var(--shadow-sm);

}

.hero-category-btn:hover{

    transform:translateY(-3px);

    box-shadow:var(--shadow-md);

    color:var(--heading);

}

.hero-service-box{

    position:absolute;

    left:50%;

    top:65%;

    transform:translateX(-50%);

    display:flex;

    gap:25px;

    z-index:10;

}

.hero-service-item{

    width:180px;

    padding:10px;

    border-radius:15px;

    text-align:center;

    text-decoration:none;

    background:rgba(255,255,255,.45);

    backdrop-filter:blur(8px);

    color:var(--heading);

    box-shadow:var(--shadow-md);

    transition:.3s;

}

.hero-service-item:hover{

    transform:translateY(-5px);
    background:rgba(255,255,255,.70);

    color:var(--link);

}

.hero-service-item i{

    font-size:42px;

    display:block;

    margin-bottom:10px;

}

.hero-service-item span{

    display:block;

    font-size:20px;

    font-weight:700;

}

@media(max-width:768px){

    .hero-service-box{

        flex-wrap:nowrap;

        gap:10px;

    }

    .hero-service-item{

        width:95px;
        height:95px;

        padding:10px;

        border-radius:18px;

        background:rgba(255,255,255,.45);

    }

    .hero-service-item i{

        font-size:25px;

    }

    .hero-service-item span{

        font-size:13px;

    }

}