._bbr9fq_home_dm295n_{

    max-width: 1500px;
    padding-left: 20px;
    padding-right: 20px;
    margin: 0 auto;
    /* margin-top: 100px; */
    /* padding: 10px; */
    /* border: 1px solid red; */

    height: fit-content;
    width: 100%;
    /* border: 1px solid red; */
    display: flex;
    justify-content: center;
    align-items: start;
    gap: 20px;
    /* background-color: var(--background_color); */



}

/* ====================== Home Heading ====================== */
._home_main_heading_{
    width: 100%;
    font-size: 36px;
    font-weight: 800;
    color: var(--dark_color);
    line-height: 1.25;
    letter-spacing: -0.5px;
    font-family: 'Outfit', 'Segoe UI', sans-serif;
}

._home_heading_accent_{
    color: var(--primary_color);
}

@media only screen and (max-width: 700px){
    ._home_main_heading_{
        font-size: 26px;
    }
}
@media only screen and (max-width: 400px){
    ._home_main_heading_{
        font-size: 22px;
    }
}

/* ====================== Scrollable Content ====================== */


._e5rj6m_scrollable_content_o842aj_{
    /* border: 2px solid blue; */
    height: fit-content;
    width: 75%;
    display: flex;
    justify-content: start;
    align-items: start;
    gap: 20px;
    flex-direction: column;
    padding-top: 30px;
}



/* ====================== Tools Section ====================== */
._gxhp7n_tools_section_91tn6s_{
    max-width: 1080px;
    width: 100%;
    height: fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 40px;
    margin-bottom: 20px;


}

._hr26ee_tools_section_heading_5w2vk6_
{
    /* border: 1px solid pink; */
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 20px;
    width: 100% ;
}

._ud00ec_tools_section_heading_text_a5qoox_{
    font-size: 30px;
    font-weight: 600;
    text-wrap: nowrap;
    color: var(--dark_color);
}

._4xibth_tools_section_heading_line_z0kuu0_{
    width: 100%;
    height: 1px;
    border-radius: 10px;
    background-color: var(--dark_secondary_color);
}
/* ========= Card Section ========= */
._70gka3_tools_card_section_p32nf4_{
    /* border: 1px solid green; */
    /* width: fit-content; */
    /* max-width: 1080px; */
    margin-top: 20px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    height: fit-content;
    display: grid;
    grid-template-rows: repeat(auto-fill, 1fr);
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 30px;
}
._zaey8d_tools_card_ue87kv_{
    height: 100%;
    /* height: 300px; */
    /* border: 1px solid red; */
    border-radius: 10px;
    box-shadow: 0px 0px 10px var(--dark_secondary_color);
    border: 1px solid var(--border_color);
    flex-grow: 1;
    padding: 20px;
    transition: all 0.2s linear;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: start;
    flex-direction: column;
    gap: 10px;
    position: relative;
    z-index: 1;
    container-type: inline-size;
    background-color: var(--background_color);
}
/* ._zaey8d_tools_card_ue87kv_:last-child{
    max-width: 340px;
} */


._zaey8d_tools_card_ue87kv_:hover{
    transform: scale(1.02) translateY(-10px);
    box-shadow: 0px 0px 10px var(--dark_secondary_color);

}

._m5mv18_tools_card_img_0ks1s2_{
    /* border: 1px solid red; */
    /* width: 60px; */
    height: 70px;
}
._tbwwji_tools_card_link_2yctqz_{
    /* border: 1px solid red; */
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: start;
    flex-direction: column;
    gap: 10px;
}
._m5mv18_tools_card_img_0ks1s2_ img{
    height: 100%;
    width: 100%;
}

._0v30zs_tools_card_heading_646tdg_{
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 1px;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    height: fit-content;
    transition: all 0.2s linear;
    color: var(--dark_color);
}
/* ._zaey8d_tools_card_ue87kv_:hover > ._0v30zs_tools_card_heading_646tdg_{
    text-decoration: underline;
} */

._7g4mi4_visit_btn_gck02t_{
   padding: 5px 10px ;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
    border: 1px solid var(--dark_color);
    color: var(--dark_color);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    transition: all 0.1s linear;

}


._7g4mi4_visit_btn_gck02t_ svg{

    transform: rotate(-180deg);
    /* transition: all 0.1s linear; */

}
._7g4mi4_visit_btn_gck02t_:hover{
    background-color: var(--dark_color);
    color: var(--background_color);
}


._rt7rpg_tools_card_description_g6rdi6_{
    font-size: 15px;
    font-weight: 400;
    color: var(--dark_color);

}

._nb53rk_tools_card_btn_section_37kh75_{
    width: 100%;
    display: flex;
    justify-content: start;
    align-items: start;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 10px;

}

._qi1d5s_tools_card_btn_vg9dzp_{
    width: fit-content;
    height: fit-content;
    flex-grow: 1;
    padding: 5px 15px;
    border-radius: 50px;
    border: 1px solid var(--primary_color);
    background-color: var(--background_color);
    color: var(--primary_color);
    cursor: pointer;
    transition: all 0.2s linear;
    position: relative;
}
._qi1d5s_tools_card_btn_vg9dzp_:hover{
    background-color: var(--primary_color);
    color: var(--background_color);
}

._qi1d5s_tools_card_btn_vg9dzp_.share{
    color: #28a745;
    border: 1px solid #28a745;
}

._qi1d5s_tools_card_btn_vg9dzp_.comment{
    color: var(--dark_color);
    border: 1px solid #d1d1d1;
}



._3j0u53_tools_card_btn_content_6wc3x4_{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;


}

._qi1d5s_tools_card_btn_vg9dzp_:hover.share{
    color: var(--background_color);
    /* border: 1px solid #28a745; */
    background-color: #28a745;
}

._qi1d5s_tools_card_btn_vg9dzp_:hover.comment{
    color: var(--dark_color);
    border: 1px solid var(--dark_color);
    background-color: #d1d1d1;
}

._rhxkm1_tools_card_btn_content_icon_0zlygx_{
    height: fit-content;
    width: fit-content;
    /* border: 1px solid red; */
    display: flex;
    justify-content: center;
    align-items: center;

}

._yknu4v_tools_card_btn_content_text_id9dqk_{
    font-size: 13px;
    letter-spacing: 1px;
    font-weight: 500;
}

._g7nn95_spinner_doyvt3_ {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    border: 2px solid transparent;
    border-top: 2px solid var(--primary_color);
    border-radius: 50%;
    animation: spin 1s linear infinite;
    transform: translate(-50%, -50%);
    display: none;
  }
  ._qi1d5s_tools_card_btn_vg9dzp_:hover ._g7nn95_spinner_doyvt3_{
    border-top: 2px solid var(--background_color);
}

  @keyframes spin {
    0% {
      transform: translate(-50%, -50%) rotate(0deg);
    }
    100% {
      transform: translate(-50%, -50%) rotate(360deg);
    }
  }


  ._qi1d5s_tools_card_btn_vg9dzp_.loading ._3j0u53_tools_card_btn_content_6wc3x4_ {
    visibility: hidden;
  }

  ._qi1d5s_tools_card_btn_vg9dzp_.loading ._g7nn95_spinner_doyvt3_ {
    display: block;
  }



/* ====================== Category Tags ====================== */
._ucpmvb_categories_container_1rrfdq_{
    width: 100%;
    height: fit-content;
    /* border: 1px solid red; */
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    /* overflow-x: scroll; */
}

._ucpmvb_categories_container_1rrfdq_::-webkit-scrollbar{
    display: none;
}

._ju3feh_category_ingh7o_ {
    padding: 5px 20px;
    border: 1px solid var(--primary_color);
    border-radius: 50px;
    color: var(--primary_color);
    cursor: pointer;
    transition: all 0.2s linear;
    font-size: 15px;
    font-weight: 500;
    text-wrap: nowrap;
}

._ju3feh_category_ingh7o_:hover{
    background-color: var(--primary_color);
    color: var(--background_color);
}

._ju3feh_category_ingh7o_.active{
    background-color: var(--primary_color);
    color: var(--background_color);
}


/* ========= Fixed Section Responsive ( RESPONSIVE ) ========= */

@media only screen and (max-width: 1050px)
{
    ._zaey8d_tools_card_ue87kv_{
        /* height: 350px; */
        padding-top: 30px;
    }
}

@media only screen and (max-width: 700px)
{
    ._ud00ec_tools_section_heading_text_a5qoox_{
        font-size: 25px;
    }
    ._e5rj6m_scrollable_content_o842aj_{
        width: 100%;
    }
    ._zaey8d_tools_card_ue87kv_{
        /* height: fit-content; */
        /* min-height: fit-content; */

        /* max-width: 100%; */
        /* min-width: 200px; */
        padding: 15px;
        flex-grow: 1;
    }
    ._0v30zs_tools_card_heading_646tdg_{
        font-size: 18px;
        /* border: 1px solid red; */
        text-wrap: nowrap;
        max-width: 230px;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    /* ._rt7rpg_tools_card_description_g6rdi6_{
        display: none;
    } */

    ._ucpmvb_categories_container_1rrfdq_{
        flex-wrap: nowrap;
        overflow-x: scroll;
    }
    ._70gka3_tools_card_section_p32nf4_
    {
        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    }
}

@media only screen and (max-width: 580px)
{
    ._0v30zs_tools_card_heading_646tdg_{
        font-size: 15px;
        width: 100%;
        text-wrap: wrap;
    }
    ._70gka3_tools_card_section_p32nf4_
    {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 10px;
    }
    ._m5mv18_tools_card_img_0ks1s2_{
        height: 50px;
    }
    ._rt7rpg_tools_card_description_g6rdi6_{
        font-size: 13px;
    }

}

@media only screen and (max-width: 467px)
{
    ._rt7rpg_tools_card_description_g6rdi6_{
        display: block;
    }
    ._0v30zs_tools_card_heading_646tdg_{
        font-size: 20px;
        width: 100%;
        max-width: 100%;
    }
    ._zaey8d_tools_card_ue87kv_
    {
        height: fit-content;
    }
}

@media only screen and (max-width: 360px)
{
    ._70gka3_tools_card_section_p32nf4_
    {
        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    }
}