
body { margin: 0; font-family: Arial, sans-serif; }
header { background: #222; color: #fff; padding: 20px; text-align: center; }
nav a { color: #fff; margin: 0 15px; text-decoration: none; }
.hero { height: 400px; background: url('../images/hero.jpg') center/cover no-repeat; display: flex; align-items: center; justify-content: center; color: #fff; text-align: center; }
.hero h2 { font-size: 2.5em; margin: 0; }
.hero p { font-size: 1.2em; margin: 10px 0; }
button, .call-btn { background: #ffc107; border: none; padding: 10px 20px; font-weight: bold; cursor: pointer; margin-top: 10px; text-decoration: none; display: inline-block; color: #000; }
.popup { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); justify-content: center; align-items: center; }
.popup-content { background: #fff; padding: 30px; border-radius: 8px; width: 90%; max-width: 400px; text-align: center; }
.popup-content input { width: 100%; margin: 10px 0; padding: 10px; }
.popup-content button, .call-btn { margin-top: 10px; }
.close { position: absolute; right: 20px; top: 10px; font-size: 24px; cursor: pointer; color: #333; }
footer { background: #222; color: #fff; text-align: center; padding: 15px; margin-top: 20px; }
