/* أزرار التواصل في الهيرو */
.omsnctadxfrj {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 1em;
    width: 100%;
    margin-top: .5em;
}

    /* الزر — نظام تصميم واحد لكل أزرار الهيرو (اتصل بنا / واتساب) */
    .omsnctadxfrjbtn {
        --btnr: 999px;

        /* محطّتا السطح: البرتقالي ممزوج بالأسود، فرق خفيف جدًا بين الأعلى والأسفل */
        --btntop: color-mix(in srgb, var(--primary) 82%, var(--helper));
        --btnbottom: color-mix(in srgb, var(--primary) 56%, var(--helper));

        box-sizing: border-box;
        position: relative;
        display: flex;
        direction: ltr;
        align-items: center;
        justify-content: center;
        gap: .6em;
        padding: .72em 2.4em;
        border: 0;
        border-radius: var(--btnr);
        font-family: inherit;
        font-size: 1rem;
        font-weight: 700;
        line-height: 1;
        letter-spacing: .01em;
        text-decoration: none;
        white-space: nowrap;
        cursor: pointer;
        color: var(--secondary);

        /* سطح الزر: إضاءة علوية ناعمة + تدرّج عمودي خفيف يبقى برتقاليًا */
        background-image:
            radial-gradient(120% 88% at 50% -14%,
                rgba(255, 255, 255, .18) 0%,
                rgba(255, 255, 255, 0) 52%),
            linear-gradient(180deg,
                color-mix(in srgb, var(--primary) 90%, var(--helper)) 0%,
                var(--btntop) 42%,
                var(--btnbottom) 100%);

        box-shadow:
            /* لمعة علوية رفيعة على السطح */
            inset 0 2px 1px rgba(255, 255, 255, .28),
            /* تعتيم خفيف للجوانب لإحساس التدوير */
            inset 4px 0 6px rgba(0, 0, 0, .08),
            inset -4px 0 6px rgba(0, 0, 0, .08),
            /* تجميع ظل داخلي أسفل السطح (جزء من العمق) */
            inset 0 -5px 7px rgba(0, 0, 0, .20),
            inset 0 -1px 1px rgba(0, 0, 0, .40),
            /* خط أسود علوي رفيع جدًا */
            inset 0 1px 0 rgba(0, 0, 0, .35);

        transition: background-image .3s ease;
    }

        /* اللمعة البرتقالية/البنية الرفيعة: تظهر خلف الحد الأسود،
           رفيعة أعلى والجوانب، أوضح وأسمك أسفل */
        .omsnctadxfrjbtn::after {
            content: "";
            position: absolute;
            inset: -3px -3px -9px -3px;
            z-index: -2;
            border-radius: var(--btnr);
            background-image: linear-gradient(180deg,
                color-mix(in srgb, var(--primary) 55%, var(--helper)) 0%,
                var(--primary) 100%);
            pointer-events: none;
        }

        /* الحد الأسود: رفيع جدًا أعلى والجوانب، أسمك بوضوح أسفل،
           ويحمل الضوء السفلي الاتجاهي الناعم */
        .omsnctadxfrjbtn::before {
            content: "";
            position: absolute;
            inset: -2px -2px -6px -2px;
            z-index: -1;
            border-radius: var(--btnr);
            background: var(--helper);
            box-shadow:
                0 5px 12px -3px color-mix(in srgb, var(--primary) 42%, transparent),
                0 9px 20px -6px rgba(0, 0, 0, .45);
            transition: box-shadow .3s ease;
            pointer-events: none;
        }

        /* النص: أبيض، متمركز، مع عزل اتجاه العربية داخل زر LTR */
        .omsnctadxfrjlabel {
            direction: rtl;
            unicode-bidi: isolate;
        }

        /* الأيقونة: أيقونة Font Awesome بيضاء على يسار النص فعليًا، بنفس الوزن البصري */
        .omsnctadxfrjicon {
            flex-shrink: 0;
            font-size: 1.05em;
            line-height: 1;
            color: var(--secondary);
        }

    /* حالة المرور: تفتيح خفيف للسطح وتقوية الضوء السفلي دون أي إزاحة */
    .omsnctadxfrjbtn:hover {
        --btntop: color-mix(in srgb, var(--primary) 92%, var(--helper));
        --btnbottom: color-mix(in srgb, var(--primary) 66%, var(--helper));
    }

        .omsnctadxfrjbtn:hover::before {
            box-shadow:
                0 5px 14px -3px color-mix(in srgb, var(--primary) 55%, transparent),
                0 9px 22px -6px rgba(0, 0, 0, .5);
        }


/* الاستجابة */
@media (max-width: 560px) {

    .omsnctadxfrj {
        gap: .8em;
    }

    .omsnctadxfrjbtn {
        padding: .68em 1.9em;
        font-size: .95rem;
    }

}
