.elementor-7327 .elementor-element.elementor-element-84ecf39 > .elementor-container{max-width:1160px;}.elementor-7327 .elementor-element.elementor-element-d825582{width:var( --container-widget-width, 91.05% );max-width:91.05%;--container-widget-width:91.05%;--container-widget-flex-grow:0;}.elementor-7327 .elementor-element.elementor-element-5674578 > .elementor-container{max-width:1160px;}.elementor-7327 .elementor-element.elementor-element-5674578{border-style:solid;border-width:0px 0px 1px 0px;border-color:#F1EDF7;z-index:10;}.elementor-widget-theme-site-logo .widget-image-caption{color:var( --e-global-color-text );}.elementor-7327 .elementor-element.elementor-element-b6fb2a1 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-7327 .elementor-element.elementor-element-e8f2d15 > .elementor-widget-container{margin:10px 20px 0px 0px;}.elementor-7327 .elementor-element.elementor-element-e8f2d15 .frm_search{width:100%;}.elementor-widget-icon.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-primary );}.elementor-7327 .elementor-element.elementor-element-15376f8 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-7327 .elementor-element.elementor-element-15376f8 .elementor-icon-wrapper{text-align:center;}.elementor-7327 .elementor-element.elementor-element-15376f8.elementor-view-stacked .elementor-icon{background-color:#888888;}.elementor-7327 .elementor-element.elementor-element-15376f8.elementor-view-framed .elementor-icon, .elementor-7327 .elementor-element.elementor-element-15376f8.elementor-view-default .elementor-icon{color:#888888;border-color:#888888;}.elementor-7327 .elementor-element.elementor-element-15376f8.elementor-view-framed .elementor-icon, .elementor-7327 .elementor-element.elementor-element-15376f8.elementor-view-default .elementor-icon svg{fill:#888888;}.elementor-7327 .elementor-element.elementor-element-15376f8 .elementor-icon{font-size:25px;}.elementor-7327 .elementor-element.elementor-element-15376f8 .elementor-icon svg{height:25px;}.elementor-7327 .elementor-element.elementor-element-c890c52 > .elementor-widget-container{margin:10px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-7327 .elementor-element.elementor-element-c890c52 .header_cart_button{background-color:#F1E9FF;}.elementor-7327 .elementor-element.elementor-element-c890c52 .header_cart_button:before{color:#7B35D4;}.elementor-7327 .elementor-element.elementor-element-fb0f40c > .elementor-container{max-width:1160px;}.elementor-7327 .elementor-element.elementor-element-fb0f40c{border-style:solid;border-width:0px 0px 1px 0px;border-color:#F1EDF7;}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before,
					.elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-7327 .elementor-element.elementor-element-6104e70 .elementor-menu-toggle{margin-left:auto;}.elementor-7327 .elementor-element.elementor-element-6104e70 .elementor-nav-menu--main .elementor-item{color:#2C2B2B;fill:#2C2B2B;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-7327 .elementor-element.elementor-element-68b2f9c{width:15.086%;}.elementor-7327 .elementor-element.elementor-element-fe86965{width:62.93%;}.elementor-7327 .elementor-element.elementor-element-344e46a{width:6.293%;}.elementor-7327 .elementor-element.elementor-element-71bc5f8{width:15.691%;}}@media(max-width:767px){.elementor-7327 .elementor-element.elementor-element-5674578{margin-top:37px;margin-bottom:0px;}.elementor-7327 .elementor-element.elementor-element-68b2f9c{width:100%;}.elementor-7327 .elementor-element.elementor-element-fe86965{width:60%;}.elementor-7327 .elementor-element.elementor-element-344e46a{width:20%;}.elementor-7327 .elementor-element.elementor-element-15376f8 .elementor-icon-wrapper{text-align:start;}.elementor-7327 .elementor-element.elementor-element-71bc5f8{width:20%;}}/* Start custom CSS for section, class: .elementor-element-84ecf39 *//* =====================================================
   AVENDOR MODERN HOMEPAGE
   Main Stylesheet
===================================================== */


/* =====================================================
   RESET
===================================================== */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


html {
    scroll-behavior: smooth;
}


body {
    font-family: "Vazirmatn", sans-serif;
    direction: rtl;
    background: #ffffff;
    color: #272238;
    line-height: 1.8;
}


a {
    color: inherit;
    text-decoration: none;
}


button,
input {
    font-family: inherit;
}


button {
    border: none;
    cursor: pointer;
}


img {
    max-width: 100%;
    display: block;
}


ul {
    list-style: none;
}


/* =====================================================
   VARIABLES
===================================================== */

:root {

    --primary: #7b35d4;

    --primary-dark: #6023ad;

    --primary-light: #f1e8ff;

    --primary-soft: #faf7ff;

    --text: #272238;

    --text-light: #777482;

    --border: #eeeeF4;

    --background: #ffffff;

    --light-bg: #faf9fc;

    --success: #23b39b;

    --danger: #ef6262;

    --radius-small: 10px;

    --radius-medium: 18px;

    --radius-large: 28px;

    --shadow: 0 8px 30px rgba(74, 42, 120, 0.07);

    --container: 1200px;

}


/* =====================================================
   GLOBAL CONTAINER
===================================================== */

.container {

    width: 100%;

    max-width: var(--container);

    margin: 0 auto;

    padding-left: 20px;

    padding-right: 20px;

}


/* =====================================================
   TOP BAR
===================================================== */

.top-bar {

    height: auto;

    background:

        linear-gradient(

            90deg,

            #faf6ff,

            #ffffff,

            #fff8ec

        );

    border-bottom: 1px solid #f1edf7;

    font-size: 12px;

    color: var(--text-light);

}


.top-bar-inner {

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: space-between;

}


.top-message {

    display: flex;

    align-items: center;

    gap: 8px;

}


.top-message i {

    color: var(--primary);

}


.top-message strong {

    color: var(--primary);

    font-weight: 800;

}


.top-links {

    display: flex;

    gap: 22px;
    text-align: left;

}


.top-links a {

    transition: 0.25s;
    text-align: right;

}


.top-links a:hover {

    color: var(--primary);

}


/* =====================================================
   MAIN HEADER
===================================================== */

.main-header {

    background: #ffffff;

    border-bottom: 1px solid #f3f1f6;

}


.header-inner {

    min-height: 86px;

    display: flex;

    align-items: center;

    gap: 30px;

}


/* =====================================================
   LOGO
===================================================== */

.logo {

    display: flex;

    align-items: center;

    gap: 10px;

    min-width: 190px;

}


.logo-icon {

    width: 44px;

    height: 44px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: var(--primary);

    color: #ffffff;

    border-radius: 14px;

    font-size: 20px;

    transform: rotate(-5deg);

}


.logo-text {

    display: flex;

    flex-direction: column;

    line-height: 1.2;

}


.logo-text strong {

    direction: ltr;

    font-size: 26px;

    font-weight: 800;

    color: var(--primary);

    letter-spacing: -1px;

}


.logo-text span {

    color: #9994a4;

    font-size: 9px;

    margin-top: 4px;

}


/* =====================================================
   SEARCH
===================================================== */

.search-box {

    flex: 1;

    height: 48px;

    max-width: 470px;

    position: relative;

}


.search-box input {

    width: 100%;

    height: 100%;

    padding: 0 22px 0 58px;

    border: 1px solid #e5e0ec;

    border-radius: 50px;

    outline: none;

    font-size: 13px;

    color: var(--text);

    background: #ffffff;

    transition: 0.3s;

}


.search-box input::placeholder {

    color: #aaa5b2;

}


.search-box input:focus {

    border-color: var(--primary);

    box-shadow:

        0 0 0 4px

        rgba(123, 53, 212, 0.08);

}


.search-box button {

    position: absolute;

    left: 6px;

    top: 6px;

    width: 36px;

    height: 36px;

    border-radius: 50%;

    color: var(--primary);

    background: var(--primary-light);

    font-size: 14px;

}


/* =====================================================
   HEADER ACTIONS
===================================================== */

.header-actions {

    margin-right: auto;

    display: flex;

    align-items: center;

    gap: 20px;

}


.header-action {

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 2px;

    color: var(--text-light);

    font-size: 10px;

    transition: 0.25s;

}


.header-action i {

    font-size: 18px;

    color: var(--text);

}


.header-action:hover {

    color: var(--primary);

}


.cart-button {

    width: 46px;

    height: 46px;

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--primary);

    background: var(--primary-light);

    border-radius: 14px;

    font-size: 18px;

}


.cart-count {

    position: absolute;

    top: -7px;

    right: -7px;

    width: 20px;

    height: 20px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: var(--danger);

    color: #ffffff;

    font-size: 10px;

    border-radius: 50%;

    border: 2px solid #ffffff;

}


/* =====================================================
   MOBILE MENU BUTTON
===================================================== */

.mobile-menu-button {

    display: none;

    width: 42px;

    height: 42px;

    background: var(--primary-light);

    color: var(--primary);

    border-radius: 12px;

    font-size: 18px;

}


/* =====================================================
   NAVIGATION
===================================================== */

.main-navigation {

    background: #ffffff;

    border-bottom: 1px solid #f5f3f7;

}


.navigation-inner {

    height: 54px;

    display: flex;

    align-items: center;

    justify-content: space-between;

}


.navigation-menu {

    display: flex;

    align-items: center;

    gap: 28px;

}


.navigation-menu a {

    position: relative;

    display: flex;

    align-items: center;

    gap: 6px;

    height: 54px;

    color: #666170;

    font-size: 12px;

    white-space: nowrap;

    transition: 0.25s;

}


.navigation-menu a::after {

    content: "";

    position: absolute;

    right: 0;

    bottom: 0;

    width: 0;

    height: 3px;

    background: var(--primary);

    border-radius: 5px 5px 0 0;

    transition: 0.3s;

}


.navigation-menu a:hover,

.navigation-menu a.active {

    color: var(--primary);

}


.navigation-menu a:hover::after,

.navigation-menu a.active::after {

    width: 100%;

}


.navigation-menu a i {

    font-size: 11px;

}


.special-offer {

    display: flex;

    align-items: center;

    gap: 7px;

    color: var(--primary);

    font-size: 12px;

    font-weight: 600;

}


.special-offer i {

    font-size: 13px;

}


/* =====================================================
   MOBILE MENU
===================================================== */

.mobile-menu {

    position: fixed;

    top: 0;

    right: -320px;

    width: 300px;

    height: 100vh;

    z-index: 9999;

    background: #ffffff;

    box-shadow: -10px 0 40px rgba(0, 0, 0, 0.12);

    transition: 0.35s;

}


.mobile-menu.active {

    right: 0;

}


.mobile-menu-header {

    height: 70px;

    padding: 0 20px;

    display: flex;

    align-items: center;

    justify-content: space-between;

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

}


.mobile-menu-header strong {

    font-size: 16px;

}


.mobile-menu-header button {

    width: 36px;

    height: 36px;

    border-radius: 10px;

    background: #f7f5fa;

    color: var(--text);

}


.mobile-menu-links {

    padding: 20px;

    display: flex;

    flex-direction: column;

}


.mobile-menu-links a {

    display: flex;

    align-items: center;

    gap: 14px;

    padding: 15px 8px;

    border-bottom: 1px solid #f4f2f7;

    font-size: 13px;

    color: var(--text);

}


.mobile-menu-links a i {

    width: 22px;

    color: var(--primary);

}/* End custom CSS */