body{font-family:'Vazir',sans-serif;margin:0;padding:0;background:#f4f4f9;color:#333;direction:rtl;text-align:right}header{background:#2c3e50;color:#fff;padding:1rem;text-align:center}nav ul{list-style:none;padding:0;display:flex;justify-content:center;gap:1.5rem}nav ul li a{color:#fff;text-decoration:none;font-weight:700}nav ul li a:hover{color:#3498db}main{max-width:800px;margin:2rem auto;padding:0 1rem}section{background:#fff;padding:2rem;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.1);animation:fadeIn 1s ease-in;overflow:hidden}.box-container{display:flex;gap:1rem;justify-content:space-between}.box{flex:1;background:#f9f9f9;padding:1rem;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.1);min-height:300px;display:flex;flex-direction:column;justify-content:center;align-items:center}.box p{margin:0.5rem 0}.btn{background:#3498db;color:#fff;border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer;font-size:1rem;margin:0.5rem;transition:transform .3s ease,opacity .3s ease,-webkit-transform .3s ease}.btn:hover{transform:scale(1.05);opacity:.9;-webkit-transform:scale(1.05)}.content-image{max-width:100%;height:auto;border-radius:8px;margin:1rem 0;transition:transform .3s ease,-webkit-transform .3s ease}.content-image:hover{animation:imageHover .5s ease-in-out;-webkit-animation:imageHover .5s ease-in-out}.notification{position:fixed;left:20px;top:20px;background:#fff;padding:1rem;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.2);opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;-webkit-transition:opacity .3s ease,visibility .3s ease}.notification.show{opacity:1;visibility:visible}.notification-contact{background:#2ecc71}.notification-about{background:#3498db;color:#fff}footer{background:#2c3e50;color:#fff;text-align:center;padding:1rem;bottom:0;width:100%}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px);-webkit-transform:translateY(20px)}100%{opacity:1;transform:translateY(0);-webkit-transform:translateY(0)}}@keyframes imageHover{0%{transform:translateY(0) scale(1);-webkit-transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.1);-webkit-transform:translateY(-10px) scale(1.1)}100%{transform:translateY(0) scale(1);-webkit-transform:translateY(0) scale(1)}}@media (max-width:600px){nav ul{flex-direction:column;gap:.5rem}main{margin:1rem}.box-container{flex-direction:column}.box{min-height:200px}.notification{left:10px;right:10px;width:calc(100% - 20px)}}