:root {
    --naranja: #F5921E;
    --negro: #1a1a1a;
    --gris-claro: #f4f4f4;
    --blanco: #ffffff;
}

* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }

body { color: var(--negro); line-height: 1.6; background-color: var(--blanco); }

.container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

/* Header */
header { background: var(--blanco); padding: 15px 0; border-bottom: 2px solid var(--gris-claro); sticky; top: 0; z-index: 1000; }
nav { display: flex; justify-content: space-between; align-items: center; }
.logo { height: 60px; }
.btn-call { background: var(--negro); color: white; padding: 10px 20px; border-radius: 5px; text-decoration: none; font-weight: bold; }

/* Hero */
.hero { 
    background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)), url('img/Gemini_Generated_Image_it7i9rit7i9rit7i.png'); 
    background-size: cover; background-position: center;
    color: white; padding: 100px 0; text-align: center;
}
.hero h1 { font-size: 3rem; margin-bottom: 20px; }
.highlight { color: var(--naranja); }
.btn-primary { background: var(--naranja); color: white; padding: 15px 30px; text-decoration: none; font-size: 1.2rem; border-radius: 5px; display: inline-block; transition: 0.3s; }
.btn-primary:hover { background: #d47a16; transform: scale(1.05); }

/* Badges */
.badges { display: flex; justify-content: space-around; padding: 40px 0; background: var(--gris-claro); margin-top: -30px; border-radius: 10px; position: relative; }
.badge { text-align: center; font-weight: bold; }
.badge i { display: block; font-size: 2rem; color: var(--naranja); margin-bottom: 5px; }

/* Grid de Servicios */
.services { padding: 80px 0; }
.section-title { text-align: center; margin-bottom: 40px; font-size: 2.2rem; }
.services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; }
.card { padding: 30px; border: 1px solid #ddd; border-radius: 10px; text-align: center; transition: 0.3s; }
.card.featured { border: 2px solid var(--naranja); box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
.card i { font-size: 2.5rem; color: var(--naranja); margin-bottom: 15px; }
.price { display: block; margin-top: 15px; font-size: 1.5rem; font-weight: bold; color: var(--naranja); }

/* Formulario */
.contact-section { background: var(--negro); color: white; padding: 80px 0; }
.contact-container { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; }
.contact-form { display: flex; flex-direction: column; gap: 15px; }
.contact-form input, .contact-form select, .contact-form textarea { padding: 12px; border-radius: 5px; border: none; }
.btn-submit { background: var(--naranja); color: white; border: none; padding: 15px; cursor: pointer; font-weight: bold; }
a{color: #ddd;}

/* WhatsApp */
.whatsapp-float { position: fixed; bottom: 20px; right: 20px; background: #3fb56a; color: white; width: 60px; height: 60px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 30px; box-shadow: 2px 2px 10px rgba(0,0,0,0.3); z-index: 1000; }

/* Responsivo */
@media (max-width: 768px) {
    .contact-container { grid-template-columns: 1fr; }
    .hero h1 { font-size: 2rem; }
    .badges { flex-direction: column; gap: 20px; }
}