.elementor-331 .elementor-element.elementor-element-249a9ae{--display:flex;}.elementor-331 .elementor-element.elementor-element-6dbd07e{--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;}.elementor-331 .elementor-element.elementor-element-6dbd07e:not(.elementor-motion-effects-element-type-background), .elementor-331 .elementor-element.elementor-element-6dbd07e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://benaresh.org/wp-content/uploads/2026/07/ChatGPT-Image-Jul-29-2026-08_20_39-AM-1.png");background-position:-59px 408px;}body.elementor-page-331:not(.elementor-motion-effects-element-type-background), body.elementor-page-331 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-3a0abe1 );}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-331 .elementor-element.elementor-element-6dbd07e:not(.elementor-motion-effects-element-type-background), .elementor-331 .elementor-element.elementor-element-6dbd07e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:0px 0px;}}@media(max-width:767px){.elementor-331 .elementor-element.elementor-element-6dbd07e:not(.elementor-motion-effects-element-type-background), .elementor-331 .elementor-element.elementor-element-6dbd07e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:0px 0px;}}/* Start custom CSS for html, class: .elementor-element-920a35f */<style>


@font-face{

font-family:Digibold;

src:url("https://benaresh.org/wp-content/uploads/2026/06/DIGI-RASTIN-BOLD-1.ttf");

}




/* =========================
   CONTACT WRAPPER
========================= */


.bn-contact-box{


width:340px;

height:340px;


position:relative;


margin:auto;


font-family:Digibold,sans-serif;


}





/* =========================
   CENTER
========================= */


.bn-contact-center{


position:absolute;


left:50%;

top:50%;


transform:translate(-50%,-50%);



width:120px;

height:120px;



background:#111;



color:#fff;



display:flex;


align-items:center;


justify-content:center;



font-size:18px;



cursor:pointer;



z-index:5;



transition:.35s ease;


}





.bn-contact-center:hover{


background:#827d55;


}





/* =========================
   OPTIONS
========================= */


.bn-contact-option{


position:absolute;


left:50%;

top:50%;



width:65px;

height:65px;



background:#827d55;



border:0;



border-radius:0;



display:flex;


align-items:center;


justify-content:center;



opacity:0;


pointer-events:none;



transform:translate(-50%,-50%) scale(.5);



transition:

.65s cubic-bezier(.16,1,.3,1);



text-decoration:none;


}




.bn-contact-option svg{


width:27px;

height:27px;



stroke:#fff;


fill:none;



stroke-width:1.6;



stroke-linecap:round;


stroke-linejoin:round;



transition:.3s;


}





/* =========================
   OPEN ON HOVER
========================= */


.bn-contact-box:hover 
.bn-contact-option{


opacity:1;


pointer-events:auto;


}





.bn-contact-box:hover 
.bn-contact-instagram{


transform:
translate(-50%,-150px)
scale(1);


}





.bn-contact-box:hover 
.bn-contact-linkedin{


transform:
translate(85px,-50%)
scale(1);


}





.bn-contact-box:hover 
.bn-contact-phone{


transform:
translate(-50%,85px)
scale(1);


}





.bn-contact-box:hover 
.bn-contact-map{


transform:
translate(-150px,-50%)
scale(1);


}







/* =========================
   ICON HOVER
========================= */


.bn-contact-option:hover{


background:#111;


}





.bn-contact-option:hover svg{


transform:scale(1.1);


}





/* =========================
   POPUP
========================= */


.bn-contact-popup{


position:fixed;


inset:0;



background:rgba(130,125,85,.92);



display:flex;


align-items:center;


justify-content:center;



opacity:0;


visibility:hidden;



transition:.4s;



z-index:999999;


}





.bn-contact-popup.active{


opacity:1;


visibility:visible;


}







.bn-contact-popup-card{


width:350px;


background:#fff;


padding:40px;



position:relative;



font-family:Digibold,sans-serif;



transform:

translateY(30px)
scale(.95);



opacity:0;



transition:.45s cubic-bezier(.16,1,.3,1);


}





.bn-contact-popup.active 
.bn-contact-popup-card{


transform:

translateY(0)
scale(1);



opacity:1;


}






.bn-contact-popup-card h2{


text-align:center;


font-size:25px;


margin-bottom:30px;


color:#111;


}





.bn-contact-close{


position:absolute;


right:15px;


top:10px;



background:none;


border:0;



font-size:30px;



cursor:pointer;


color:#111;


}





#bnLinks{


display:flex;


flex-direction:column;


gap:12px;


}





#bnLinks a{


height:50px;


border:1px solid #111;



display:flex;


align-items:center;


justify-content:center;



text-decoration:none;


color:#111;



font-family:Digibold,sans-serif;



transition:.3s;


}





#bnLinks a:hover{


background:#827d55;


color:#fff;


}





/* =========================
   MOBILE
========================= */


@media(max-width:600px){


.bn-contact-box{


width:250px;

height:250px;


}



.bn-contact-center{


width:95px;


height:95px;


font-size:15px;


}



.bn-contact-option{


width:55px;

height:55px;


}



.bn-contact-option svg{


width:22px;


height:22px;


}





.bn-contact-box:hover 
.bn-contact-instagram{


transform:

translate(-50%,-115px)
scale(1);


}





.bn-contact-box:hover 
.bn-contact-linkedin{


transform:

translate(65px,-50%)
scale(1);


}





.bn-contact-box:hover 
.bn-contact-phone{


transform:

translate(-50%,65px)
scale(1);


}





.bn-contact-box:hover 
.bn-contact-map{


transform:

translate(-115px,-50%)
scale(1);


}




.bn-contact-popup-card{


width:85%;


padding:30px;


}


}

/* =========================
   FINAL PREMIUM TOUCH
========================= */


/* فاصله کمی بیشتر از مربع اصلی */

.bn-contact-option{

will-change:transform,opacity;

}





/* ورود نرم‌تر هر مربع */


.bn-contact-box:hover 
.bn-contact-instagram{

transition-delay:.05s;

}



.bn-contact-box:hover 
.bn-contact-linkedin{

transition-delay:.12s;

}



.bn-contact-box:hover 
.bn-contact-phone{

transition-delay:.18s;

}



.bn-contact-box:hover 
.bn-contact-map{

transition-delay:.25s;

}






/* حرکت خیلی ظریف هنگام باز شدن */


.bn-contact-box:hover 
.bn-contact-option{


filter:blur(0);


}






/* حالت خروج نرم */

.bn-contact-option{


transition:

opacity .4s ease,

transform .7s cubic-bezier(.16,1,.3,1),

background .3s ease;


}





/* پاپ آپ ورود حرفه ای‌تر */


.bn-contact-popup-card{


box-shadow:

0 30px 80px rgba(0,0,0,.15);


}





.bn-contact-close:hover{


background:#827d55;


color:#fff;


}







/* موبایل - جلوگیری از خروج از صفحه */


@media(max-width:600px){


.bn-contact-box{


overflow:visible;


}



.bn-contact-popup{


padding:20px;


}


}
</style>/* End custom CSS */