.elementor-13047 .elementor-element.elementor-element-600ce14{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13047 .elementor-element.elementor-element-c8ffe23{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13047 .elementor-element.elementor-element-153e41f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:30px 30px;--row-gap:30px;--column-gap:30px;}.elementor-13047 .elementor-element.elementor-element-4791545{--display:flex;--gap:30px 30px;--row-gap:30px;--column-gap:30px;}.elementor-13047 .elementor-element.elementor-element-3c2246d{--display:flex;}@media(min-width:769px){.elementor-13047 .elementor-element.elementor-element-153e41f{--width:33.3%;}.elementor-13047 .elementor-element.elementor-element-4791545{--width:33.3%;}.elementor-13047 .elementor-element.elementor-element-3c2246d{--width:33.3%;}}/* Start custom CSS for wd_extra_menu_list, class: .elementor-element-85b7156 *//* --- ১. মেইন কন্টেইনার (High-Tech Background) --- */
.keyboards_mega {
    background: #ffffff;

    border-top: 3px solid #cf2e2e; /* উপরে একটি ব্র্যান্ড কালার লাইন */
    font-family: 'Rajdhani', 'Inter', sans-serif; /* টেক ফন্ট সাপোর্ট */
    box-shadow: 0 15px 50px rgba(0,0,0,0.08);
}

/* --- ২. কলাম গ্রিড স্টাইল (Tech Grid Lines) --- */
.keyboards_mega .vc_column-inner {
    padding: 10px 15px;
    border-left: 1px dashed #e5e5e5; /* ড্যাশড লাইন দিয়ে সেপারেশন */
}
/* প্রথম কলামে বর্ডার থাকবে না */
.keyboards_mega .vc_column_container:first-child .vc_column-inner {
    border-left: none;
}

/* --- ৩. শিরোনাম (System Label Style) --- */
.keyboards_mega h4, 
.keyboards_mega h5,
.keyboards_mega .woodmart-title-container {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    color: #cf2e2e; /* ব্র্যান্ড লাল */
    background: rgba(207, 46, 46, 0.08); /* হালকা লাল ব্যাকগ্রাউন্ড */
    display: inline-block;
    padding: 6px 14px;
    border-radius: 30px; /* ক্যাপসুল শেপ */
    margin-bottom: 25px;
    letter-spacing: 1.5px;
}

/* --- ৪. লিংক বা মেনু আইটেম (Interactive Modules) --- */
.keyboards_mega ul li {
    margin-bottom: 8px;
}

.keyboards_mega a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px; /* বড় সাইজ */
    color: #1a1a1a; /* গাঢ় কালো */
    font-weight: 600;
    padding: 12px 15px;
    background: #fdfdfd; /* খুব হালকা ধূসর */
    border: 1px solid #f0f0f0; /* সূক্ষ্ম বর্ডার */
    border-radius: 8px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); /* বাউন্সি এনিমেশন */
    position: relative;
    overflow: hidden;
}

/* --- ৫. হোভার ইফেক্ট (3D Activation) --- */
.keyboards_mega a:hover {
    border-color: #cf2e2e; /* বর্ডার লাল হবে */
    background: #ffffff;
    color: #cf2e2e; /* টেক্সট লাল */
    transform: translateY(-4px); /* উপরে ভেসে উঠবে (3D Lift) */
    box-shadow: 0 10px 20px rgba(207, 46, 46, 0.15); /* লাল গ্লো ইফেক্ট */
}

/* হোভার করলে বাম পাশে সলিড ফিল বার (Progress Bar Effect) */
.keyboards_mega a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: #cf2e2e;
    transform: scaleY(0); /* শুরুতে লুকিয়ে থাকবে */
    transform-origin: bottom;
    transition: transform 0.3s ease;
}

.keyboards_mega a:hover::before {
    transform: scaleY(1); /* নিচ থেকে উপরে ফিল হবে */
}

/* ডান পাশের আইকন (Smart Chevron) */
.keyboards_mega a::after {
    content: '›'; /* টেক অ্যারো */
    font-size: 20px;
    line-height: 1;
    color: #dddddd;
    transition: all 0.3s ease;
    transform: translateX(-10px);
}

.keyboards_mega a:hover::after {
    color: #cf2e2e;
    transform: translateX(0); /* ডানে সরে আসবে */
}/* End custom CSS */
/* Start custom CSS for wd_extra_menu_list, class: .elementor-element-ae4f912 *//* --- ১. মেইন কন্টেইনার (High-Tech Background) --- */
.mouse_mega {
    background: #ffffff;

    border-top: 3px solid #cf2e2e; /* উপরে একটি ব্র্যান্ড কালার লাইন */
    font-family: 'Rajdhani', 'Inter', sans-serif; /* টেক ফন্ট সাপোর্ট */
    box-shadow: 0 15px 50px rgba(0,0,0,0.08);
}

/* --- ২. কলাম গ্রিড স্টাইল (Tech Grid Lines) --- */
.mouse_mega .vc_column-inner {
    padding: 10px 15px;
    border-left: 1px dashed #e5e5e5; /* ড্যাশড লাইন দিয়ে সেপারেশন */
}
/* প্রথম কলামে বর্ডার থাকবে না */
.mouse_mega .vc_column_container:first-child .vc_column-inner {
    border-left: none;
}

/* --- ৩. শিরোনাম (System Label Style) --- */
.mouse_mega h4, 
.mouse_mega h5,
.mouse_mega .woodmart-title-container {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    color: #cf2e2e; /* ব্র্যান্ড লাল */
    background: rgba(207, 46, 46, 0.08); /* হালকা লাল ব্যাকগ্রাউন্ড */
    display: inline-block;
    padding: 6px 14px;
    border-radius: 30px; /* ক্যাপসুল শেপ */
    margin-bottom: 25px;
    letter-spacing: 1.5px;
}

/* --- ৪. লিংক বা মেনু আইটেম (Interactive Modules) --- */
.mouse_mega ul li {
    margin-bottom: 8px;
}

.mouse_mega a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px; /* বড় সাইজ */
    color: #1a1a1a; /* গাঢ় কালো */
    font-weight: 600;
    padding: 12px 15px;
    background: #fdfdfd; /* খুব হালকা ধূসর */
    border: 1px solid #f0f0f0; /* সূক্ষ্ম বর্ডার */
    border-radius: 8px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); /* বাউন্সি এনিমেশন */
    position: relative;
    overflow: hidden;
}

/* --- ৫. হোভার ইফেক্ট (3D Activation) --- */
.mouse_mega a:hover {
    border-color: #cf2e2e; /* বর্ডার লাল হবে */
    background: #ffffff;
    color: #cf2e2e; /* টেক্সট লাল */
    transform: translateY(-4px); /* উপরে ভেসে উঠবে (3D Lift) */
    box-shadow: 0 10px 20px rgba(207, 46, 46, 0.15); /* লাল গ্লো ইফেক্ট */
}

/* হোভার করলে বাম পাশে সলিড ফিল বার (Progress Bar Effect) */
.mouse_mega a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: #cf2e2e;
    transform: scaleY(0); /* শুরুতে লুকিয়ে থাকবে */
    transform-origin: bottom;
    transition: transform 0.3s ease;
}

.mouse_mega a:hover::before {
    transform: scaleY(1); /* নিচ থেকে উপরে ফিল হবে */
}

/* ডান পাশের আইকন (Smart Chevron) */
.mouse_mega a::after {
    content: '›'; /* টেক অ্যারো */
    font-size: 20px;
    line-height: 1;
    color: #dddddd;
    transition: all 0.3s ease;
    transform: translateX(-10px);
}

.mouse_mega a:hover::after {
    color: #cf2e2e;
    transform: translateX(0); /* ডানে সরে আসবে */
}/* End custom CSS */
/* Start custom CSS for wd_extra_menu_list, class: .elementor-element-dc220cf *//* --- ১. মেইন কন্টেইনার (High-Tech Background) --- */
.audio_pc_mega {
    background: #ffffff;

    border-top: 3px solid #cf2e2e; /* উপরে একটি ব্র্যান্ড কালার লাইন */
    font-family: 'Rajdhani', 'Inter', sans-serif; /* টেক ফন্ট সাপোর্ট */
    box-shadow: 0 15px 50px rgba(0,0,0,0.08);
}

/* --- ২. কলাম গ্রিড স্টাইল (Tech Grid Lines) --- */
.audio_pc_mega .vc_column-inner {
    padding: 10px 15px;
    border-left: 1px dashed #e5e5e5; /* ড্যাশড লাইন দিয়ে সেপারেশন */
}
/* প্রথম কলামে বর্ডার থাকবে না */
.audio_pc_mega .vc_column_container:first-child .vc_column-inner {
    border-left: none;
}

/* --- ৩. শিরোনাম (System Label Style) --- */
.audio_pc_mega h4, 
.audio_pc_mega h5,
.audio_pc_mega .woodmart-title-container {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    color: #cf2e2e; /* ব্র্যান্ড লাল */
    background: rgba(207, 46, 46, 0.08); /* হালকা লাল ব্যাকগ্রাউন্ড */
    display: inline-block;
    padding: 6px 14px;
    border-radius: 30px; /* ক্যাপসুল শেপ */
    margin-bottom: 25px;
    letter-spacing: 1.5px;
}

/* --- ৪. লিংক বা মেনু আইটেম (Interactive Modules) --- */
.audio_pc_mega ul li {
    margin-bottom: 8px;
}

.audio_pc_mega a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px; /* বড় সাইজ */
    color: #1a1a1a; /* গাঢ় কালো */
    font-weight: 600;
    padding: 12px 15px;
    background: #fdfdfd; /* খুব হালকা ধূসর */
    border: 1px solid #f0f0f0; /* সূক্ষ্ম বর্ডার */
    border-radius: 8px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); /* বাউন্সি এনিমেশন */
    position: relative;
    overflow: hidden;
}

/* --- ৫. হোভার ইফেক্ট (3D Activation) --- */
.audio_pc_mega a:hover {
    border-color: #cf2e2e; /* বর্ডার লাল হবে */
    background: #ffffff;
    color: #cf2e2e; /* টেক্সট লাল */
    transform: translateY(-4px); /* উপরে ভেসে উঠবে (3D Lift) */
    box-shadow: 0 10px 20px rgba(207, 46, 46, 0.15); /* লাল গ্লো ইফেক্ট */
}

/* হোভার করলে বাম পাশে সলিড ফিল বার (Progress Bar Effect) */
.audio_pc_mega a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: #cf2e2e;
    transform: scaleY(0); /* শুরুতে লুকিয়ে থাকবে */
    transform-origin: bottom;
    transition: transform 0.3s ease;
}

.audio_pc_mega a:hover::before {
    transform: scaleY(1); /* নিচ থেকে উপরে ফিল হবে */
}

/* ডান পাশের আইকন (Smart Chevron) */
.audio_pc_mega a::after {
    content: '›'; /* টেক অ্যারো */
    font-size: 20px;
    line-height: 1;
    color: #dddddd;
    transition: all 0.3s ease;
    transform: translateX(-10px);
}

.audio_pc_mega a:hover::after {
    color: #cf2e2e;
    transform: translateX(0); /* ডানে সরে আসবে */
}/* End custom CSS */
/* Start custom CSS for wd_extra_menu_list, class: .elementor-element-03698b2 *//* --- ১. মেইন কন্টেইনার (High-Tech Background) --- */
.storage_drives_mega {
    background: #ffffff;

    border-top: 3px solid #cf2e2e; /* উপরে একটি ব্র্যান্ড কালার লাইন */
    font-family: 'Rajdhani', 'Inter', sans-serif; /* টেক ফন্ট সাপোর্ট */
    box-shadow: 0 15px 50px rgba(0,0,0,0.08);
}

/* --- ২. কলাম গ্রিড স্টাইল (Tech Grid Lines) --- */
.storage_drives_mega .vc_column-inner {
    padding: 10px 15px;
    border-left: 1px dashed #e5e5e5; /* ড্যাশড লাইন দিয়ে সেপারেশন */
}
/* প্রথম কলামে বর্ডার থাকবে না */
.storage_drives_mega .vc_column_container:first-child .vc_column-inner {
    border-left: none;
}

/* --- ৩. শিরোনাম (System Label Style) --- */
.storage_drives_mega h4, 
.storage_drives_mega h5,
.storage_drives_mega .woodmart-title-container {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    color: #cf2e2e; /* ব্র্যান্ড লাল */
    background: rgba(207, 46, 46, 0.08); /* হালকা লাল ব্যাকগ্রাউন্ড */
    display: inline-block;
    padding: 6px 14px;
    border-radius: 30px; /* ক্যাপসুল শেপ */
    margin-bottom: 25px;
    letter-spacing: 1.5px;
}

/* --- ৪. লিংক বা মেনু আইটেম (Interactive Modules) --- */
.storage_drives_mega ul li {
    margin-bottom: 8px;
}

.storage_drives_mega a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px; /* বড় সাইজ */
    color: #1a1a1a; /* গাঢ় কালো */
    font-weight: 600;
    padding: 12px 15px;
    background: #fdfdfd; /* খুব হালকা ধূসর */
    border: 1px solid #f0f0f0; /* সূক্ষ্ম বর্ডার */
    border-radius: 8px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); /* বাউন্সি এনিমেশন */
    position: relative;
    overflow: hidden;
}

/* --- ৫. হোভার ইফেক্ট (3D Activation) --- */
.storage_drives_mega a:hover {
    border-color: #cf2e2e; /* বর্ডার লাল হবে */
    background: #ffffff;
    color: #cf2e2e; /* টেক্সট লাল */
    transform: translateY(-4px); /* উপরে ভেসে উঠবে (3D Lift) */
    box-shadow: 0 10px 20px rgba(207, 46, 46, 0.15); /* লাল গ্লো ইফেক্ট */
}

/* হোভার করলে বাম পাশে সলিড ফিল বার (Progress Bar Effect) */
.storage_drives_mega a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: #cf2e2e;
    transform: scaleY(0); /* শুরুতে লুকিয়ে থাকবে */
    transform-origin: bottom;
    transition: transform 0.3s ease;
}

.storage_drives_mega a:hover::before {
    transform: scaleY(1); /* নিচ থেকে উপরে ফিল হবে */
}

/* ডান পাশের আইকন (Smart Chevron) */
.storage_drives_mega a::after {
    content: '›'; /* টেক অ্যারো */
    font-size: 20px;
    line-height: 1;
    color: #dddddd;
    transition: all 0.3s ease;
    transform: translateX(-10px);
}

.storage_drives_mega a:hover::after {
    color: #cf2e2e;
    transform: translateX(0); /* ডানে সরে আসবে */
}/* End custom CSS */
/* Start custom CSS for wd_extra_menu_list, class: .elementor-element-fd45605 *//* --- ১. মেইন কন্টেইনার (High-Tech Background) --- */
.connectivity_mega {
    background: #ffffff;

    border-top: 3px solid #cf2e2e; /* উপরে একটি ব্র্যান্ড কালার লাইন */
    font-family: 'Rajdhani', 'Inter', sans-serif; /* টেক ফন্ট সাপোর্ট */
    box-shadow: 0 15px 50px rgba(0,0,0,0.08);
}

/* --- ২. কলাম গ্রিড স্টাইল (Tech Grid Lines) --- */
.connectivity_mega .vc_column-inner {
    padding: 10px 15px;
    border-left: 1px dashed #e5e5e5; /* ড্যাশড লাইন দিয়ে সেপারেশন */
}
/* প্রথম কলামে বর্ডার থাকবে না */
.connectivity_mega .vc_column_container:first-child .vc_column-inner {
    border-left: none;
}

/* --- ৩. শিরোনাম (System Label Style) --- */
.connectivity_mega h4, 
.connectivity_mega h5,
.connectivity_mega .woodmart-title-container {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    color: #cf2e2e; /* ব্র্যান্ড লাল */
    background: rgba(207, 46, 46, 0.08); /* হালকা লাল ব্যাকগ্রাউন্ড */
    display: inline-block;
    padding: 6px 14px;
    border-radius: 30px; /* ক্যাপসুল শেপ */
    margin-bottom: 25px;
    letter-spacing: 1.5px;
}

/* --- ৪. লিংক বা মেনু আইটেম (Interactive Modules) --- */
.connectivity_mega ul li {
    margin-bottom: 8px;
}

.connectivity_mega a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px; /* বড় সাইজ */
    color: #1a1a1a; /* গাঢ় কালো */
    font-weight: 600;
    padding: 12px 15px;
    background: #fdfdfd; /* খুব হালকা ধূসর */
    border: 1px solid #f0f0f0; /* সূক্ষ্ম বর্ডার */
    border-radius: 8px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); /* বাউন্সি এনিমেশন */
    position: relative;
    overflow: hidden;
}

/* --- ৫. হোভার ইফেক্ট (3D Activation) --- */
.connectivity_mega a:hover {
    border-color: #cf2e2e; /* বর্ডার লাল হবে */
    background: #ffffff;
    color: #cf2e2e; /* টেক্সট লাল */
    transform: translateY(-4px); /* উপরে ভেসে উঠবে (3D Lift) */
    box-shadow: 0 10px 20px rgba(207, 46, 46, 0.15); /* লাল গ্লো ইফেক্ট */
}

/* হোভার করলে বাম পাশে সলিড ফিল বার (Progress Bar Effect) */
.connectivity_mega a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: #cf2e2e;
    transform: scaleY(0); /* শুরুতে লুকিয়ে থাকবে */
    transform-origin: bottom;
    transition: transform 0.3s ease;
}

.connectivity_mega a:hover::before {
    transform: scaleY(1); /* নিচ থেকে উপরে ফিল হবে */
}

/* ডান পাশের আইকন (Smart Chevron) */
.connectivity_mega a::after {
    content: '›'; /* টেক অ্যারো */
    font-size: 20px;
    line-height: 1;
    color: #dddddd;
    transition: all 0.3s ease;
    transform: translateX(-10px);
}

.connectivity_mega a:hover::after {
    color: #cf2e2e;
    transform: translateX(0); /* ডানে সরে আসবে */
}/* End custom CSS */
/* Start custom CSS for wd_extra_menu_list, class: .elementor-element-41d9f6f *//* --- ১. মেইন কন্টেইনার (High-Tech Background) --- */
.others_mega {
    background: #ffffff;

    border-top: 3px solid #cf2e2e; /* উপরে একটি ব্র্যান্ড কালার লাইন */
    font-family: 'Rajdhani', 'Inter', sans-serif; /* টেক ফন্ট সাপোর্ট */
    box-shadow: 0 15px 50px rgba(0,0,0,0.08);
}

/* --- ২. কলাম গ্রিড স্টাইল (Tech Grid Lines) --- */
.others_mega .vc_column-inner {
    padding: 10px 15px;
    border-left: 1px dashed #e5e5e5; /* ড্যাশড লাইন দিয়ে সেপারেশন */
}
/* প্রথম কলামে বর্ডার থাকবে না */
.others_mega .vc_column_container:first-child .vc_column-inner {
    border-left: none;
}

/* --- ৩. শিরোনাম (System Label Style) --- */
.others_mega h4, 
.others_mega h5,
.others_mega .woodmart-title-container {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    color: #cf2e2e; /* ব্র্যান্ড লাল */
    background: rgba(207, 46, 46, 0.08); /* হালকা লাল ব্যাকগ্রাউন্ড */
    display: inline-block;
    padding: 6px 14px;
    border-radius: 30px; /* ক্যাপসুল শেপ */
    margin-bottom: 25px;
    letter-spacing: 1.5px;
}

/* --- ৪. লিংক বা মেনু আইটেম (Interactive Modules) --- */
.others_mega ul li {
    margin-bottom: 8px;
}

.others_mega a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px; /* বড় সাইজ */
    color: #1a1a1a; /* গাঢ় কালো */
    font-weight: 600;
    padding: 12px 15px;
    background: #fdfdfd; /* খুব হালকা ধূসর */
    border: 1px solid #f0f0f0; /* সূক্ষ্ম বর্ডার */
    border-radius: 8px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); /* বাউন্সি এনিমেশন */
    position: relative;
    overflow: hidden;
}

/* --- ৫. হোভার ইফেক্ট (3D Activation) --- */
.others_mega a:hover {
    border-color: #cf2e2e; /* বর্ডার লাল হবে */
    background: #ffffff;
    color: #cf2e2e; /* টেক্সট লাল */
    transform: translateY(-4px); /* উপরে ভেসে উঠবে (3D Lift) */
    box-shadow: 0 10px 20px rgba(207, 46, 46, 0.15); /* লাল গ্লো ইফেক্ট */
}

/* হোভার করলে বাম পাশে সলিড ফিল বার (Progress Bar Effect) */
.others_mega a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: #cf2e2e;
    transform: scaleY(0); /* শুরুতে লুকিয়ে থাকবে */
    transform-origin: bottom;
    transition: transform 0.3s ease;
}

.others_mega a:hover::before {
    transform: scaleY(1); /* নিচ থেকে উপরে ফিল হবে */
}

/* ডান পাশের আইকন (Smart Chevron) */
.others_mega a::after {
    content: '›'; /* টেক অ্যারো */
    font-size: 20px;
    line-height: 1;
    color: #dddddd;
    transition: all 0.3s ease;
    transform: translateX(-10px);
}

.others_mega a:hover::after {
    color: #cf2e2e;
    transform: translateX(0); /* ডানে সরে আসবে */
}/* End custom CSS */