body { margin:0; font-family:Tahoma,sans-serif; direction:rtl; }
header { display:flex; justify-content:space-between; align-items:center; background:#4CAF50; padding:10px 20px; color:white; }
header .logo { font-size:24px; font-weight:bold; }
nav ul { list-style:none; display:flex; margin:0; padding:0; }
nav ul li { margin-left:20px; }
nav ul li a { color:white; text-decoration:none; font-weight:bold; }
.menu-toggle { display:none; font-size:28px; cursor:pointer; }
.hero { padding:50px 20px; text-align:center; background:#88c; color:white; }
.units { padding:20px; }
.unit-list { display:flex; flex-wrap:wrap; gap:10px; }
.unit { display:block; flex:1 1 calc(33% - 20px); background:#eee; padding:20px; text-align:center; text-decoration:none; color:#333; border-radius:8px; transition:0.2s; }
.unit:hover { transform:scale(1.05); background:#d4ffd4; }
footer { text-align:center; padding:20px; background:#333; color:white; }
@media(max-width:768px){
    nav ul { flex-direction:column; display:none; background:#4CAF50; width:100%; }
    nav ul.active { display:flex; }
    .menu-toggle { display:block; }
    .unit-list { flex-direction:column; }
    .unit { flex:1 1 100%; }
}