/* ==================================================================
   REYNX STUDIO — SIGNOFF BAND (signoff.css)
   لوك-أب terms1 كتوقيع سفلي — موحّد في كل الصفحات (12)
   الاستخدام:  <figure class="rx-signoff"><img ...></figure>
   الصفحات الفاتحة (index / about / services / login): الشكل الأساسي
   الصفحات الغامقة (support / cart / orders / settings / account /
   favorites / opinion / admin): كلاس إضافي rx-signoff--dark
   → الصورة بتقلب فتبقى خلفية غامقة والشعار أبيض
   ================================================================== */

.rx-signoff {
    display: block;
    width: min(1132px, calc(100% - 48px));
    margin: 64px auto;
    overflow: hidden;
    border: 1px solid rgba(16, 17, 20, .08);
    border-radius: 20px;
    background: rgba(255, 255, 255, .4);
    box-shadow: 0 18px 46px rgba(16, 17, 20, .07);
    transition: box-shadow .45s ease, border-color .45s ease;
}

.rx-signoff:hover {
    border-color: rgba(16, 17, 20, .16);
    box-shadow: 0 24px 56px rgba(16, 17, 20, .1);
}

.rx-signoff img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1920 / 340;
    object-fit: cover;
    object-position: center;
}

/* ── الصفحات الغامقة: خلفية غامقة + شعار أبيض (قلب + إزالة التلوّن) ── */
.rx-signoff--dark {
    border-color: rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .05);
    box-shadow: 0 18px 46px rgba(0, 0, 0, .45);
}

.rx-signoff--dark:hover {
    border-color: rgba(255, 255, 255, .22);
    box-shadow: 0 24px 56px rgba(0, 0, 0, .55);
}

.rx-signoff--dark img { filter: invert(1) saturate(0); }

/* ── login: الصفحة flex بلوحتين (order1/2) — التوقيع سطر تالت لف تحتهم ── */
body.rx-access-page { flex-wrap: wrap; }
body.rx-access-page > .rx-signoff { order: 3; }

@media (max-width: 640px) {
    .rx-signoff {
        width: min(1132px, calc(100% - 32px));
        margin: 48px auto;
    }
    /* الموبايل: قصّ أضيق حول الشعار عشان يفضل مقروء */
    .rx-signoff img { aspect-ratio: 700 / 447; }
}

@media (prefers-reduced-motion: reduce) {
    .rx-signoff { transition: none !important; }
}