.elementor-61 .elementor-element.elementor-element-a35b6d2{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-61 .elementor-element.elementor-element-d7aa014{margin:-170px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}body.elementor-page-61:not(.elementor-motion-effects-element-type-background), body.elementor-page-61 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#02010100;}/* Start custom CSS for html, class: .elementor-element-a35b6d2 */.vista-image-section{

    max-width:1400px;
    margin:80px auto;
    padding:0 20px;

}

.vista-image{

    position:relative;
    overflow:hidden;
    border-radius:28px;
    border:1px solid rgba(217,190,130,.25);

}

.vista-image img{

    width:100%;
    height:650px;
    object-fit:cover;
    display:block;
    transition:.6s;

}

.vista-image:hover img{

    transform:scale(1.05);

}

.image-overlay{

    position:absolute;
    inset:0;

    background:linear-gradient(
        90deg,
        rgba(0,0,0,.88) 15%,
        rgba(0,0,0,.55) 45%,
        rgba(0,0,0,.15) 100%
    );

    display:flex;
    align-items:center;

}

.image-content{

    width:50%;
    padding:70px;

}

.subtitle{

    color:#D9BE82;
    letter-spacing:4px;
    font-size:13px;
    text-transform:uppercase;

}

.image-content h2{

    color:#fff;
    font-size:52px;
    line-height:1.4;
    margin:20px 0;

}

.image-content p{

    color:#ddd;
    line-height:2.2;
    font-size:17px;

}

.vista-image:hover{

    box-shadow:0 20px 60px rgba(217,190,130,.18);

}
@media(max-width:992px){

.image-content{

    width:70%;
    padding:45px;

}

.image-content h2{

    font-size:38px;

}

}

@media(max-width:768px){
    
.vista-image-section {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

.vista-image {
    margin-bottom: 0 !important;
}



.story-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* جلوگیری از فاصله اضافی باکس‌های داخل Grid */
.story-grid > .story-box {
    margin: 0 !important;
}

.vista-image img{

    height:500px;

}

.image-overlay{

    background:linear-gradient(
        180deg,
        rgba(0,0,0,.15),
        rgba(0,0,0,.90)
    );

    align-items:flex-end;

}

.image-content{

    width:100%;
    padding:30px;

}

.subtitle{

    font-size:11px;
    letter-spacing:2px;

}

.image-content h2{

    font-size:28px;
    margin:15px 0;

}

.image-content p{

    font-size:15px;
    line-height:2;

}

}

@media(max-width:480px){
    
 .story-box.hero {
    margin-top: 0 !important;
    margin-bottom: 20px !important;
}

.vista-image img{

    height:420px;

}

.image-content{

    padding:22px;

}

.image-content h2{

    font-size:22px;

}

.image-content p{

    font-size:14px;

}

}


.vista-story-top > .story-box.hero {
    margin-top: 20px !important;
    margin-bottom: 0 !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d7aa014 *//* ==========================
   Mobile Responsive
========================== */

@media (max-width:768px){

.vista-story{

    padding:60px 18px;

}

.story-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.story-grid > .story-box {
    margin: 0 !important;
    padding: 24px 18px;
}

.story-grid .story-box{

    margin:0;

}

.story-box{

    padding:28px 22px;
    border-radius:18px;

}

.hero{

    padding:35px 25px;

}

.hero h2{

    font-size:30px;
    line-height:1.6;
    margin-bottom:18px;

}

.story-box h3{

    font-size:22px;
    line-height:1.5;
    margin-top:0;
    margin-bottom:15px;

}

.story-box p{

    font-size:15px;
    line-height:2.2;
    text-align:justify;
    margin-top:0;
    margin-bottom:0;

}

.box-number{

    font-size:48px;
    left:18px;
    bottom:8px;
    opacity:.12;

}

.story-quote{

    margin-top:25px;
    padding:35px 20px;
    border-radius:18px;

}

.story-quote h2{

    font-size:24px;
    line-height:1.8;

}

}


@media (max-width:480px){

.vista-story{

    padding:40px 15px;

}

.hero h2{

    font-size:26px;

}

.story-box h3{

    font-size:20px;

}

.story-box p{

    font-size:14px;
    line-height:2.1;

}

.story-box{

    padding:24px 18px;

}

.story-quote h2{

    font-size:20px;

}

.box-number{

    font-size:38px;

}

}/* End custom CSS */