.elementor-330 .elementor-element.elementor-element-b63e6d6{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-48c5f77 *//*==========================
Google Font
===========================*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

*{

margin:0;
padding:0;
box-sizing:border-box;

}

body{

font-family:'Inter',sans-serif;
background:#ffffff;

}

/*==========================
Container
===========================*/

.container{

width:1200px;
margin:auto;

}

/*==========================
Category Hero
===========================*/

.category-hero{

position:relative;

padding:110px 0 90px;

overflow:hidden;

background:
linear-gradient(180deg,#ffffff 0%,#f7f6ff 100%);

text-align:center;

}

/*==========================
Badge
===========================*/

.hero-badge{

display:inline-flex;

align-items:center;

padding:12px 22px;

background:#F1EDFF;

color:#6C4DF6;

font-size:14px;

font-weight:700;

border-radius:100px;

letter-spacing:.8px;

text-transform:uppercase;

margin-bottom:30px;

}

/*==========================
Heading
===========================*/

.category-hero h1{

font-size:62px;

font-weight:800;

line-height:1.15;

color:#111827;

max-width:900px;

margin:auto;

}

/*==========================
Description
===========================*/

.category-hero p{

margin:30px auto 45px;

max-width:760px;

font-size:20px;

line-height:36px;

color:#6B7280;

}

/*==========================
Search
===========================*/

.category-search{

display:flex;

width:760px;

margin:auto;

background:#ffffff;

border-radius:16px;

padding:8px;

box-shadow:
0 12px 40px rgba(93,63,211,.08);

}

.category-search input{

flex:1;

border:none;

padding:22px;

font-size:17px;

outline:none;

background:none;

}

.category-search button{

border:none;

background:#6C4DF6;

color:#fff;

padding:18px 42px;

font-size:17px;

font-weight:600;

border-radius:12px;

cursor:pointer;

transition:.3s;

}

.category-search button:hover{

background:#5b3ef2;

}

/*==========================
Decorative Shapes
===========================*/

.shape-left{

position:absolute;

left:-120px;

bottom:-80px;

width:300px;

height:300px;

background:#EFE9FF;

border-radius:50%;

opacity:.6;

}

.shape-right{

position:absolute;

right:-80px;

top:-60px;

width:280px;

height:280px;

border:2px solid #DDD3FF;

border-radius:50%;

opacity:.5;

}

/*==========================
Responsive
===========================*/

@media(max-width:1200px){

.container{

width:92%;

}

.category-search{

width:100%;

}

}

@media(max-width:768px){

.category-hero{

padding:70px 0;

}

.category-hero h1{

font-size:40px;

}

.category-hero p{

font-size:17px;

line-height:30px;

}

.category-search{

flex-direction:column;

gap:10px;

}

.category-search button{

width:100%;

}

}/* End custom CSS */