/* =========================================================
   بنر تبلیغاتی - فول عرض و ریسپانسیو
   ========================================================= */

.up-banner-section {
    width: 100%;
    background: transparent;
    padding: 0;
}

.up-banner-container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 25px;
}

.up-banner-link {
    display: block;
    width: 100%;
    border-radius: 18px;
    overflow: hidden;
    box-shadow:
        0 10px 35px rgba(0, 0, 0, 0.08),
        0 2px 8px rgba(0, 0, 0, 0.04);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    background: #f4f6f9;
    line-height: 0;
    text-decoration: none;
}

.up-banner-link::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 18px;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);
    pointer-events: none;
    transition: all 0.4s;
}

.up-banner-link:hover {
    transform: translateY(-4px);
    box-shadow:
        0 20px 50px rgba(72, 55, 243, 0.15),
        0 4px 12px rgba(0, 0, 0, 0.06);
}

.up-banner-link:hover::after {
    box-shadow: inset 0 0 0 2px rgba(72, 55, 243, 0.15);
}

.up-banner-link img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.up-banner-link:hover img {
    transform: scale(1.02);
}

/* =========================================
   ریسپانسیو
   ========================================= */
@media (max-width: 992px) {
    .up-banner-container { padding: 0 20px; }
    .up-banner-link { border-radius: 14px; }
    .up-banner-link::after { border-radius: 14px; }
}

@media (max-width: 768px) {
    .up-banner-section { margin: 20px 0 !important; }
    .up-banner-container { padding: 0 15px; }
    .up-banner-link { border-radius: 12px; }
    .up-banner-link::after { border-radius: 12px; }
    .up-banner-link:hover { transform: translateY(-2px); }
}

@media (max-width: 480px) {
    .up-banner-section { margin: 15px 0 !important; }
    .up-banner-link { border-radius: 10px; }
    .up-banner-link::after { border-radius: 10px; }
    .up-banner-link:hover img { transform: none; }
}