.cta-buttons{ display:flex; flex-direction:column; /* ترتيب رأسي (مناسب للموبايل) */ align-items:center; /* توسيط أفقي */ gap:12px; /* المسافة بين الأزرار */ margin:0; } .btns{ background:#FFBD33; color:#111; font:600 14px/1 Arial, sans-serif; padding:14px 20px; border:none; border-radius:2px; text-decoration:none; display:inline-block; cursor:pointer; transition:background .25s, color .25s, transform .15s; min-width:210px; /* اختياري: تثبيت عرض متقارب */ text-align:center; } .btns:hover{ background:#f2b228; color:#fff; } .btns:active{ transform:translateY(1px); } .btns:focus{ outline:2px solid #000; outline-offset:2px; } /* على الشاشات الأوسع ممكن نخليهم بجانب بعض */ @media (min-width:500px){ .cta-buttons{ flex-direction:row; } }
.cta-buttons{ display:flex; flex-direction:column; /* ترتيب رأسي (مناسب للموبايل) */ align-items:center; /* توسيط أفقي */ gap:12px; /* المسافة بين الأزرار */ margin:0; } .btns{ background:#FFBD33; color:#111; font:600 14px/1 Arial, sans-serif; padding:14px 20px; border:none; border-radius:2px; text-decoration:none; display:inline-block; cursor:pointer; transition:background .25s, color .25s, transform .15s; min-width:210px; /* اختياري: تثبيت عرض متقارب */ text-align:center; } .btns:hover{ background:#f2b228; color:#fff; } .btns:active{ transform:translateY(1px); } .btns:focus{ outline:2px solid #000; outline-offset:2px; } /* على الشاشات الأوسع ممكن نخليهم بجانب بعض */ @media (min-width:500px){ .cta-buttons{ flex-direction:row; } }
