EcoSpa - Lavado Ecol\u00f3gico Profesional<\/title>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600&display=swap\" rel=\"stylesheet\">\r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <script>\r\n tailwind.config = {\r\n theme: {\r\n extend: {\r\n colors: {\r\n 'eco-purple': '#6023dd',\r\n 'eco-orange': '#de741d',\r\n 'eco-yellow': '#ffac00',\r\n 'eco-green': '#16a34a',\r\n 'eco-gray': '#f8fafc',\r\n 'eco-dark': '#1e293b'\r\n },\r\n fontFamily: {\r\n 'montserrat': ['Montserrat', 'sans-serif'],\r\n 'inter': ['Inter', 'sans-serif']\r\n }\r\n }\r\n }\r\n }\r\n <\/script>\r\n <style>\r\n .hero-gradient {\r\n background: linear-gradient(135deg, rgba(96, 35, 221, 0.95) 0%, rgba(30, 58, 138, 0.95) 100%);\r\n }\r\n .fade-in {\r\n animation: fadeIn 0.8s ease-in;\r\n }\r\n @keyframes fadeIn {\r\n from { opacity: 0; transform: translateY(30px); }\r\n to { opacity: 1; transform: translateY(0); }\r\n }\r\n .service-card:hover {\r\n transform: translateY(-5px);\r\n transition: all 0.3s ease;\r\n }\r\n .nav-link {\r\n position: relative;\r\n }\r\n .nav-link::after {\r\n content: '';\r\n position: absolute;\r\n width: 0;\r\n height: 2px;\r\n bottom: -5px;\r\n left: 50%;\r\n background-color: #6023dd;\r\n transition: all 0.3s ease;\r\n }\r\n .nav-link:hover::after {\r\n width: 100%;\r\n left: 0;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body class=\"bg-white font-inter\">\r\n \r\n <header class=\"bg-white shadow-sm fixed w-full top-0 z-50\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"flex justify-between items-center h-20\">\r\n \r\n <div class=\"flex items-center\">\r\n <div class=\"text-2xl font-bold text-eco-purple font-montserrat\">\r\n EcoSpa\r\n <\/div>\r\n <div class=\"ml-2 text-sm text-gray-500 font-inter\">\r\n Lavado Profesional\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <nav class=\"hidden md:flex space-x-8\">\r\n <a href=\"#inicio\" class=\"nav-link text-gray-700 hover:text-eco-purple font-medium transition-colors\">Inicio<\/a>\r\n <a href=\"#servicios\" class=\"nav-link text-gray-700 hover:text-eco-purple font-medium transition-colors\">Servicios<\/a>\r\n <a href=\"#nosotros\" class=\"nav-link text-gray-700 hover:text-eco-purple font-medium transition-colors\">Nosotros<\/a>\r\n <a href=\"#contacto\" class=\"nav-link text-gray-700 hover:text-eco-purple font-medium transition-colors\">Contacto<\/a>\r\n <\/nav>\r\n \r\n \r\n <div class=\"hidden md:block\">\r\n <a href=\"#agendamiento\" class=\"bg-eco-purple hover:bg-purple-700 text-white px-6 py-3 rounded-lg font-medium transition-colors\">\r\n Agendar Cita\r\n <\/a>\r\n <\/div>\r\n \r\n \r\n <div class=\"md:hidden\">\r\n <button onclick=\"toggleMenu()\" class=\"text-gray-700\">\r\n <svg class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 6h16M4 12h16M4 18h16\" \/>\r\n <\/svg>\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <div id=\"mobile-menu\" class=\"md:hidden hidden bg-white border-t\">\r\n <div class=\"px-4 pt-2 pb-3 space-y-1\">\r\n <a href=\"#inicio\" class=\"block px-3 py-2 text-gray-700 hover:text-eco-purple\">Inicio<\/a>\r\n <a href=\"#servicios\" class=\"block px-3 py-2 text-gray-700 hover:text-eco-purple\">Servicios<\/a>\r\n <a href=\"#nosotros\" class=\"block px-3 py-2 text-gray-700 hover:text-eco-purple\">Nosotros<\/a>\r\n <a href=\"#contacto\" class=\"block px-3 py-2 text-gray-700 hover:text-eco-purple\">Contacto<\/a>\r\n <a href=\"#agendamiento\" class=\"block px-3 py-2 bg-eco-purple text-white rounded-lg mt-2\">Agendar Cita<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/header>\r\n\r\n \r\n <section id=\"inicio\" class=\"relative min-h-screen flex items-center\">\r\n <div class=\"absolute inset-0 bg-gradient-to-r from-eco-purple to-blue-800\"><\/div>\r\n <div class=\"relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-32\">\r\n <div class=\"grid lg:grid-cols-2 gap-12 items-center\">\r\n <div class=\"text-white\">\r\n <h1 class=\"text-5xl lg:text-6xl font-bold font-montserrat mb-6\">\r\n Lavado Ecol\u00f3gico\r\n <span class=\"text-eco-yellow\">Profesional<\/span>\r\n <\/h1>\r\n <p class=\"text-xl mb-8 text-gray-200 leading-relaxed\">\r\n Tecnolog\u00eda avanzada y productos biodegradables para el cuidado integral de su veh\u00edculo. \r\n Comprometidos con la excelencia y el medio ambiente.\r\n <\/p>\r\n <div class=\"flex flex-col sm:flex-row gap-4\">\r\n <a href=\"#agendamiento\" class=\"bg-eco-orange hover:bg-orange-600 text-white px-8 py-4 rounded-lg font-semibold text-lg transition-colors text-center\">\r\n Solicitar Servicio\r\n <\/a>\r\n <a href=\"#servicios\" class=\"border-2 border-white text-white hover:bg-white hover:text-eco-purple px-8 py-4 rounded-lg font-semibold text-lg transition-colors text-center\">\r\n Ver Servicios\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <div class=\"grid grid-cols-2 gap-6\">\r\n <div class=\"bg-white\/10 backdrop-blur-sm rounded-xl p-6 text-center text-white\">\r\n <div class=\"text-3xl font-bold text-eco-yellow mb-2\">95%<\/div>\r\n <div class=\"text-sm\">Menos consumo de agua<\/div>\r\n <\/div>\r\n <div class=\"bg-white\/10 backdrop-blur-sm rounded-xl p-6 text-center text-white\">\r\n <div class=\"text-3xl font-bold text-eco-yellow mb-2\">100%<\/div>\r\n <div class=\"text-sm\">Productos biodegradables<\/div>\r\n <\/div>\r\n <div class=\"bg-white\/10 backdrop-blur-sm rounded-xl p-6 text-center text-white\">\r\n <div class=\"text-3xl font-bold text-eco-yellow mb-2\">40min<\/div>\r\n <div class=\"text-sm\">Tiempo promedio<\/div>\r\n <\/div>\r\n <div class=\"bg-white\/10 backdrop-blur-sm rounded-xl p-6 text-center text-white\">\r\n <div class=\"text-3xl font-bold text-eco-yellow mb-2\">5\u2605<\/div>\r\n <div class=\"text-sm\">Calificaci\u00f3n promedio<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section id=\"servicios\" class=\"py-20 bg-eco-gray\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"text-center mb-16\">\r\n <h2 class=\"text-4xl font-bold text-eco-dark mb-4 font-montserrat\">\r\n Nuestros Servicios\r\n <\/h2>\r\n <p class=\"text-xl text-gray-600 max-w-3xl mx-auto\">\r\n Ofrecemos una gama completa de servicios de lavado ecol\u00f3gico dise\u00f1ados para satisfacer todas sus necesidades\r\n <\/p>\r\n <\/div>\r\n \r\n <div class=\"grid md:grid-cols-3 gap-8\">\r\n \r\n <div class=\"service-card bg-white rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all\">\r\n <div class=\"text-center mb-6\">\r\n <div class=\"w-16 h-16 bg-gray-100 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <span class=\"text-2xl\">\ud83e\udd48<\/span>\r\n <\/div>\r\n <h3 class=\"text-2xl font-bold text-gray-800 font-montserrat\">Silver<\/h3>\r\n <p class=\"text-gray-600 mt-2\">Servicio esencial<\/p>\r\n <\/div>\r\n <ul class=\"space-y-3 mb-8\">\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Lavado exterior completo\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Aspirado interior del veh\u00edculo\r\n <\/li>\r\n <\/ul>\r\n <button class=\"w-full bg-gray-600 hover:bg-gray-700 text-white py-3 rounded-lg font-semibold transition-colors\">\r\n Seleccionar Silver\r\n <\/button>\r\n <\/div>\r\n \r\n \r\n <div class=\"service-card bg-white rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all border-2 border-eco-yellow\">\r\n <div class=\"text-center mb-6\">\r\n <div class=\"w-16 h-16 bg-yellow-100 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <span class=\"text-2xl\">\ud83e\udd47<\/span>\r\n <\/div>\r\n <h3 class=\"text-2xl font-bold text-eco-yellow font-montserrat\">Gold<\/h3>\r\n <p class=\"text-gray-600 mt-2\">M\u00e1s popular<\/p>\r\n <div class=\"bg-eco-yellow text-white text-xs px-3 py-1 rounded-full inline-block mt-2\">\r\n RECOMENDADO\r\n <\/div>\r\n <\/div>\r\n <ul class=\"space-y-3 mb-8\">\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Todo lo incluido en Silver\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Hidrataci\u00f3n partes oscuras\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Pulido con m\u00e1quina\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Descontaminaci\u00f3n de ductos\r\n <\/li>\r\n <\/ul>\r\n <button class=\"w-full bg-eco-yellow hover:bg-yellow-500 text-white py-3 rounded-lg font-semibold transition-colors\">\r\n Seleccionar Gold\r\n <\/button>\r\n <\/div>\r\n \r\n \r\n <div class=\"service-card bg-white rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all\">\r\n <div class=\"text-center mb-6\">\r\n <div class=\"w-16 h-16 bg-purple-100 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <span class=\"text-2xl\">\ud83d\udc8e<\/span>\r\n <\/div>\r\n <h3 class=\"text-2xl font-bold text-eco-purple font-montserrat\">Diamond<\/h3>\r\n <p class=\"text-gray-600 mt-2\">Servicio premium<\/p>\r\n <\/div>\r\n <ul class=\"space-y-3 mb-8\">\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Todo lo incluido en Gold\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Lavado completo de motor\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Lavado completo de cojiner\u00eda\r\n <\/li>\r\n <\/ul>\r\n <button class=\"w-full bg-eco-purple hover:bg-purple-700 text-white py-3 rounded-lg font-semibold transition-colors\">\r\n Seleccionar Diamond\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section id=\"nosotros\" class=\"py-20 bg-white\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"grid lg:grid-cols-2 gap-16 items-center\">\r\n <div>\r\n <h2 class=\"text-4xl font-bold text-eco-dark mb-6 font-montserrat\">\r\n Compromiso con la Excelencia y el Medio Ambiente\r\n <\/h2>\r\n <p class=\"text-lg text-gray-600 mb-8 leading-relaxed\">\r\n En EcoSpa combinamos tecnolog\u00eda de vanguardia con productos 100% biodegradables para ofrecer \r\n un servicio de lavado que cuida tanto su veh\u00edculo como nuestro planeta.\r\n <\/p>\r\n \r\n <div class=\"space-y-6\">\r\n <div class=\"flex items-start\">\r\n <div class=\"w-12 h-12 bg-eco-green\/10 rounded-lg flex items-center justify-center mr-4 flex-shrink-0\">\r\n <svg class=\"w-6 h-6 text-eco-green\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Tecnolog\u00eda Avanzada<\/h3>\r\n <p class=\"text-gray-600\">Equipos de \u00faltima generaci\u00f3n que reducen el consumo de agua en un 95%<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"flex items-start\">\r\n <div class=\"w-12 h-12 bg-eco-purple\/10 rounded-lg flex items-center justify-center mr-4 flex-shrink-0\">\r\n <svg class=\"w-6 h-6 text-eco-purple\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Productos Ecol\u00f3gicos<\/h3>\r\n <p class=\"text-gray-600\">F\u00f3rmulas biodegradables que protegen el medio ambiente<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"flex items-start\">\r\n <div class=\"w-12 h-12 bg-eco-orange\/10 rounded-lg flex items-center justify-center mr-4 flex-shrink-0\">\r\n <svg class=\"w-6 h-6 text-eco-orange\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 10V3L4 14h7v7l9-11h-7z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Servicio R\u00e1pido<\/h3>\r\n <p class=\"text-gray-600\">Procesos optimizados para completar el servicio en tiempo r\u00e9cord<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"bg-eco-gray rounded-2xl p-8\">\r\n <div class=\"grid grid-cols-2 gap-6\">\r\n <div class=\"text-center\">\r\n <div class=\"text-4xl font-bold text-eco-purple mb-2 font-montserrat\">1000+<\/div>\r\n <div class=\"text-gray-600\">Veh\u00edculos atendidos<\/div>\r\n <\/div>\r\n <div class=\"text-center\">\r\n <div class=\"text-4xl font-bold text-eco-green mb-2 font-montserrat\">50K<\/div>\r\n <div class=\"text-gray-600\">Litros de agua ahorrados<\/div>\r\n <\/div>\r\n <div class=\"text-center\">\r\n <div class=\"text-4xl font-bold text-eco-orange mb-2 font-montserrat\">98%<\/div>\r\n <div class=\"text-gray-600\">Clientes satisfechos<\/div>\r\n <\/div>\r\n <div class=\"text-center\">\r\n <div class=\"text-4xl font-bold text-eco-yellow mb-2 font-montserrat\">24\/7<\/div>\r\n <div class=\"text-gray-600\">Soporte disponible<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section id=\"agendamiento\" class=\"py-20 bg-eco-gray\">\r\n <div class=\"max-w-4xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"text-center mb-12\">\r\n <h2 class=\"text-4xl font-bold text-eco-dark mb-4 font-montserrat\">\r\n Agendar Servicio\r\n <\/h2>\r\n <p class=\"text-xl text-gray-600\">Complete el formulario y nos pondremos en contacto con usted<\/p>\r\n <\/div>\r\n \r\n <div class=\"bg-white rounded-2xl shadow-xl p-8\">\r\n <form id=\"bookingForm\" class=\"space-y-6\">\r\n <div class=\"grid md:grid-cols-2 gap-6\">\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Nombre Completo *<\/label>\r\n <input type=\"text\" required class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <\/div>\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Tel\u00e9fono *<\/label>\r\n <input type=\"tel\" required class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"grid md:grid-cols-2 gap-6\">\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Email<\/label>\r\n <input type=\"email\" class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <\/div>\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Tipo de Veh\u00edculo<\/label>\r\n <select class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <option value=\"\">Seleccionar<\/option>\r\n <option value=\"automovil\">Autom\u00f3vil<\/option>\r\n <option value=\"camioneta\">Camioneta<\/option>\r\n <option value=\"suv\">SUV<\/option>\r\n <option value=\"otro\">Otro<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"grid md:grid-cols-2 gap-6\">\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Fecha Preferida<\/label>\r\n <input type=\"date\" class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <\/div>\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Hora Preferida<\/label>\r\n <select class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <option value=\"\">Seleccionar hora<\/option>\r\n <option value=\"08:00\">08:00 AM<\/option>\r\n <option value=\"09:00\">09:00 AM<\/option>\r\n <option value=\"10:00\">10:00 AM<\/option>\r\n <option value=\"11:00\">11:00 AM<\/option>\r\n <option value=\"14:00\">02:00 PM<\/option>\r\n <option value=\"15:00\">03:00 PM<\/option>\r\n <option value=\"16:00\">04:00 PM<\/option>\r\n <option value=\"17:00\">05:00 PM<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n \r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-3\">Tipo de Servicio *<\/label>\r\n <div class=\"grid md:grid-cols-3 gap-4\">\r\n <label class=\"flex items-center p-4 border-2 border-gray-200 rounded-lg cursor-pointer hover:border-eco-purple transition-colors\">\r\n <input type=\"radio\" name=\"service\" value=\"silver\" required class=\"text-eco-purple\">\r\n <div class=\"ml-3\">\r\n <div class=\"font-semibold text-gray-700\">\ud83e\udd48 Silver<\/div>\r\n <div class=\"text-sm text-gray-500\">Servicio b\u00e1sico<\/div>\r\n <\/div>\r\n <\/label>\r\n <label class=\"flex items-center p-4 border-2 border-gray-200 rounded-lg cursor-pointer hover:border-eco-purple transition-colors\">\r\n <input type=\"radio\" name=\"service\" value=\"gold\" required class=\"text-eco-purple\">\r\n <div class=\"ml-3\">\r\n <div class=\"font-semibold text-eco-yellow\">\ud83e\udd47 Gold<\/div>\r\n <div class=\"text-sm text-gray-500\">M\u00e1s popular<\/div>\r\n <\/div>\r\n <\/label>\r\n <label class=\"flex items-center p-4 border-2 border-gray-200 rounded-lg cursor-pointer hover:border-eco-purple transition-colors\">\r\n <input type=\"radio\" name=\"service\" value=\"diamond\" required class=\"text-eco-purple\">\r\n <div class=\"ml-3\">\r\n <div class=\"font-semibold text-eco-purple\">\ud83d\udc8e Diamond<\/div>\r\n <div class=\"text-sm text-gray-500\">Premium<\/div>\r\n <\/div>\r\n <\/label>\r\n <\/div>\r\n <\/div>\r\n \r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Comentarios adicionales<\/label>\r\n <textarea rows=\"4\" class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\" placeholder=\"Informaci\u00f3n adicional sobre su veh\u00edculo o preferencias...\"><\/textarea>\r\n <\/div>\r\n \r\n <button type=\"submit\" class=\"w-full bg-eco-purple hover:bg-purple-700 text-white font-semibold py-4 px-6 rounded-lg text-lg transition-colors\">\r\n Enviar Solicitud\r\n <\/button>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section id=\"contacto\" class=\"py-20 bg-white\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"text-center mb-16\">\r\n <h2 class=\"text-4xl font-bold text-eco-dark mb-4 font-montserrat\">\r\n Contacto\r\n <\/h2>\r\n <p class=\"text-xl text-gray-600\">Estamos aqu\u00ed para atenderle<\/p>\r\n <\/div>\r\n \r\n <div class=\"grid lg:grid-cols-3 gap-8\">\r\n <div class=\"text-center\">\r\n <div class=\"w-16 h-16 bg-eco-purple\/10 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <svg class=\"w-8 h-8 text-eco-purple\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Tel\u00e9fono<\/h3>\r\n <p class=\"text-gray-600\">+57 300 123 4567<\/p>\r\n <p class=\"text-sm text-gray-500\">Lun - S\u00e1b: 8:00 AM - 6:00 PM<\/p>\r\n <\/div>\r\n \r\n <div class=\"text-center\">\r\n <div class=\"w-16 h-16 bg-eco-green\/10 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <svg class=\"w-8 h-8 text-eco-green\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Email<\/h3>\r\n <p class=\"text-gray-600\">info@ecospa.com<\/p>\r\n <p class=\"text-sm text-gray-500\">Respuesta en 24 horas<\/p>\r\n <\/div>\r\n \r\n <div class=\"text-center\">\r\n <div class=\"w-16 h-16 bg-eco-orange\/10 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <svg class=\"w-8 h-8 text-eco-orange\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z\"><\/path>\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 11a3 3 0 11-6 0 3 3 0 016 0z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Ubicaci\u00f3n<\/h3>\r\n <p class=\"text-gray-600\">Calle Verde 123<\/p>\r\n <p class=\"text-sm text-gray-500\">Servicio a domicilio disponible<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <footer class=\"bg-eco-dark text-white py-12\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"grid md:grid-cols-4 gap-8\">\r\n <div>\r\n <div class=\"text-2xl font-bold mb-4 font-montserrat\">EcoSpa<\/div>\r\n <p class=\"text-gray-400 mb-4\">Lavado ecol\u00f3gico profesional comprometido con la excelencia y el cuidado del medio ambiente.<\/p>\r\n <\/div>\r\n <div>\r\n <h3 class=\"font-semibold mb-4 font-montserrat\">Servicios<\/h3>\r\n <ul class=\"space-y-2 text-gray-400\">\r\n <li>Lavado Silver<\/li>\r\n <li>Lavado Gold<\/li>\r\n <li>Lavado Diamond<\/li>\r\n <li>Servicios Corporativos<\/li>\r\n <\/ul>\r\n <\/div>\r\n <div>\r\n <h3 class=\"font-semibold mb-4 font-montserrat\">Empresa<\/h3>\r\n <ul class=\"space-y-2 text-gray-400\">\r\n <li>Nosotros<\/li>\r\n <li>Compromiso Ambiental<\/li>\r\n <li>Testimonios<\/li>\r\n <li>Contacto<\/li>\r\n <\/ul>\r\n <\/div>\r\n <div>\r\n <h3 class=\"font-semibold mb-4 font-montserrat\">Contacto<\/h3>\r\n <div class=\"space-y-2 text-gray-400\">\r\n <div>+57 300 123 4567<\/div>\r\n <div>info@ecospa.com<\/div>\r\n <div>Calle Verde 123<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"border-t border-gray-700 mt-8 pt-8 text-center text-gray-400\">\r\n <p>© 2024 EcoSpa. Todos los derechos reservados.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/footer>\r\n\r\n \r\n <div id=\"successModal\" class=\"fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center z-50\">\r\n <div class=\"bg-white rounded-2xl p-8 max-w-md mx-4 text-center\">\r\n <div class=\"w-16 h-16 bg-eco-green\/10 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <svg class=\"w-8 h-8 text-eco-green\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <h3 class=\"text-2xl font-bold text-eco-dark mb-4 font-montserrat\">\u00a1Solicitud Enviada!<\/h3>\r\n <p class=\"text-gray-600 mb-6\">Hemos recibido su solicitud. Nos pondremos en contacto con usted dentro de las pr\u00f3ximas 2 horas para confirmar su cita.<\/p>\r\n <button onclick=\"closeModal()\" class=\"bg-eco-purple hover:bg-purple-700 text-white font-semibold py-3 px-6 rounded-lg transition-colors\">\r\n Entendido\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Mobile menu toggle\r\n function toggleMenu() {\r\n const menu = document.getElementById('mobile-menu');\r\n menu.classList.toggle('hidden');\r\n }\r\n\r\n \/\/ Smooth scrolling\r\n document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\r\n anchor.addEventListener('click', function (e) {\r\n e.preventDefault();\r\n const target = document.querySelector(this.getAttribute('href'));\r\n if (target) {\r\n target.scrollIntoView({\r\n behavior: 'smooth',\r\n block: 'start'\r\n });\r\n }\r\n document.getElementById('mobile-menu').classList.add('hidden');\r\n });\r\n });\r\n\r\n \/\/ Form submission\r\n document.getElementById('bookingForm').addEventListener('submit', function(e) {\r\n e.preventDefault();\r\n document.getElementById('successModal').classList.remove('hidden');\r\n document.getElementById('successModal').classList.add('flex');\r\n this.reset();\r\n });\r\n\r\n \/\/ Close modal\r\n function closeModal() {\r\n document.getElementById('successModal').classList.add('hidden');\r\n document.getElementById('successModal').classList.remove('flex');\r\n }\r\n\r\n \/\/ Set minimum date to today\r\n const dateInput = document.querySelector('input[type=\"date\"]');\r\n if (dateInput) {\r\n const today = new Date().toISOString().split('T')[0];\r\n dateInput.setAttribute('min', today);\r\n }\r\n\r\n \/\/ Service selection from service cards\r\n document.querySelectorAll('.service-card button').forEach(button => {\r\n button.addEventListener('click', function() {\r\n const service = this.textContent.toLowerCase().includes('silver') ? 'silver' :\r\n this.textContent.toLowerCase().includes('gold') ? 'gold' : 'diamond';\r\n \r\n \/\/ Scroll to booking section\r\n document.getElementById('agendamiento').scrollIntoView({\r\n behavior: 'smooth',\r\n block: 'start'\r\n });\r\n \r\n \/\/ Pre-select the service\r\n setTimeout(() => {\r\n const radioButton = document.querySelector(`input[value=\"${service}\"]`);\r\n if (radioButton) {\r\n radioButton.checked = true;\r\n radioButton.closest('label').classList.add('border-eco-purple');\r\n }\r\n }, 500);\r\n });\r\n });\r\n\r\n \/\/ Add scroll effect to navigation\r\n window.addEventListener('scroll', function() {\r\n const header = document.querySelector('header');\r\n if (window.scrollY > 100) {\r\n header.classList.add('bg-white\/95', 'backdrop-blur-sm');\r\n } else {\r\n header.classList.remove('bg-white\/95', 'backdrop-blur-sm');\r\n }\r\n });\r\n <\/script>\r\n<script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML=\"window.__CF$cv$params={r:'95f59a5261b9af83',t:'MTc1MjU0NDE2MS4wMDAwMDA='};var a=document.createElement('script');a.nonce='';a.src='\/cdn-cgi\/challenge-platform\/scripts\/jsd\/main.js';document.getElementsByTagName('head')[0].appendChild(a);\";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();<\/script><\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>EcoSpa – Lavado Ecol\u00f3gico Profesional EcoSpa Lavado Profesional Inicio Servicios Nosotros Contacto Agendar Cita Inicio Servicios Nosotros Contacto Agendar Cita Lavado Ecol\u00f3gico Profesional Tecnolog\u00eda avanzada y productos biodegradables para el cuidado integral de su veh\u00edculo. Comprometidos con la excelencia y el medio ambiente. Solicitar Servicio Ver Servicios 95% Menos consumo de agua 100% Productos biodegradables 40min Tiempo promedio 5\u2605 Calificaci\u00f3n promedio Nuestros Servicios Ofrecemos una gama completa de servicios de lavado ecol\u00f3gico dise\u00f1ados para satisfacer todas sus necesidades \ud83e\udd48 Silver Servicio esencial Lavado exterior completo Aspirado interior del veh\u00edculo Seleccionar Silver \ud83e\udd47 Gold M\u00e1s popular RECOMENDADO Todo lo incluido en Silver Hidrataci\u00f3n partes oscuras Pulido con m\u00e1quina Descontaminaci\u00f3n de ductos Seleccionar Gold \ud83d\udc8e Diamond Servicio premium Todo lo incluido en Gold Lavado completo de motor Lavado completo de cojiner\u00eda Seleccionar Diamond Compromiso con la Excelencia y el Medio Ambiente En EcoSpa combinamos tecnolog\u00eda de vanguardia con productos 100% biodegradables para ofrecer un servicio de lavado que cuida tanto su veh\u00edculo como nuestro planeta. Tecnolog\u00eda Avanzada Equipos de \u00faltima generaci\u00f3n que reducen el consumo de agua en un 95% Productos Ecol\u00f3gicos F\u00f3rmulas biodegradables que protegen el medio ambiente Servicio R\u00e1pido Procesos optimizados para completar el servicio en tiempo r\u00e9cord 1000+ Veh\u00edculos atendidos 50K Litros de agua ahorrados 98% Clientes satisfechos 24\/7 Soporte disponible Agendar Servicio Complete el formulario y nos pondremos en contacto con usted Nombre Completo * Tel\u00e9fono * Email Tipo de Veh\u00edculo SeleccionarAutom\u00f3vilCamionetaSUVOtro Fecha Preferida Hora Preferida Seleccionar hora08:00 AM09:00 AM10:00 AM11:00 AM02:00 PM03:00 PM04:00 PM05:00 PM Tipo de Servicio * \ud83e\udd48 Silver Servicio b\u00e1sico \ud83e\udd47 Gold M\u00e1s popular \ud83d\udc8e Diamond Premium Comentarios adicionales Enviar Solicitud Contacto Estamos aqu\u00ed para atenderle Tel\u00e9fono +57 300 123 4567 Lun – S\u00e1b: 8:00 AM – 6:00 PM Email info@ecospa.com Respuesta en 24 horas Ubicaci\u00f3n Calle Verde 123 Servicio a domicilio disponible EcoSpa Lavado ecol\u00f3gico profesional comprometido con la excelencia y el cuidado del medio ambiente. Servicios Lavado Silver Lavado Gold Lavado Diamond Servicios Corporativos Empresa Nosotros Compromiso Ambiental Testimonios Contacto Contacto +57 300 123 4567 info@ecospa.com Calle Verde 123 © 2024 EcoSpa. Todos los derechos reservados. \u00a1Solicitud Enviada! Hemos recibido su solicitud. Nos pondremos en contacto con usted dentro de las pr\u00f3ximas 2 horas para confirmar su cita. Entendido<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-2","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/pages\/2","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ecospa.eco\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2"}],"version-history":[{"count":4,"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/pages\/2\/revisions"}],"predecessor-version":[{"id":12,"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/pages\/2\/revisions\/12"}],"wp:attachment":[{"href":"https:\/\/ecospa.eco\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n EcoSpa - Lavado Ecol\u00f3gico Profesional<\/title>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600&display=swap\" rel=\"stylesheet\">\r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <script>\r\n tailwind.config = {\r\n theme: {\r\n extend: {\r\n colors: {\r\n 'eco-purple': '#6023dd',\r\n 'eco-orange': '#de741d',\r\n 'eco-yellow': '#ffac00',\r\n 'eco-green': '#16a34a',\r\n 'eco-gray': '#f8fafc',\r\n 'eco-dark': '#1e293b'\r\n },\r\n fontFamily: {\r\n 'montserrat': ['Montserrat', 'sans-serif'],\r\n 'inter': ['Inter', 'sans-serif']\r\n }\r\n }\r\n }\r\n }\r\n <\/script>\r\n <style>\r\n .hero-gradient {\r\n background: linear-gradient(135deg, rgba(96, 35, 221, 0.95) 0%, rgba(30, 58, 138, 0.95) 100%);\r\n }\r\n .fade-in {\r\n animation: fadeIn 0.8s ease-in;\r\n }\r\n @keyframes fadeIn {\r\n from { opacity: 0; transform: translateY(30px); }\r\n to { opacity: 1; transform: translateY(0); }\r\n }\r\n .service-card:hover {\r\n transform: translateY(-5px);\r\n transition: all 0.3s ease;\r\n }\r\n .nav-link {\r\n position: relative;\r\n }\r\n .nav-link::after {\r\n content: '';\r\n position: absolute;\r\n width: 0;\r\n height: 2px;\r\n bottom: -5px;\r\n left: 50%;\r\n background-color: #6023dd;\r\n transition: all 0.3s ease;\r\n }\r\n .nav-link:hover::after {\r\n width: 100%;\r\n left: 0;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body class=\"bg-white font-inter\">\r\n \r\n <header class=\"bg-white shadow-sm fixed w-full top-0 z-50\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"flex justify-between items-center h-20\">\r\n \r\n <div class=\"flex items-center\">\r\n <div class=\"text-2xl font-bold text-eco-purple font-montserrat\">\r\n EcoSpa\r\n <\/div>\r\n <div class=\"ml-2 text-sm text-gray-500 font-inter\">\r\n Lavado Profesional\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <nav class=\"hidden md:flex space-x-8\">\r\n <a href=\"#inicio\" class=\"nav-link text-gray-700 hover:text-eco-purple font-medium transition-colors\">Inicio<\/a>\r\n <a href=\"#servicios\" class=\"nav-link text-gray-700 hover:text-eco-purple font-medium transition-colors\">Servicios<\/a>\r\n <a href=\"#nosotros\" class=\"nav-link text-gray-700 hover:text-eco-purple font-medium transition-colors\">Nosotros<\/a>\r\n <a href=\"#contacto\" class=\"nav-link text-gray-700 hover:text-eco-purple font-medium transition-colors\">Contacto<\/a>\r\n <\/nav>\r\n \r\n \r\n <div class=\"hidden md:block\">\r\n <a href=\"#agendamiento\" class=\"bg-eco-purple hover:bg-purple-700 text-white px-6 py-3 rounded-lg font-medium transition-colors\">\r\n Agendar Cita\r\n <\/a>\r\n <\/div>\r\n \r\n \r\n <div class=\"md:hidden\">\r\n <button onclick=\"toggleMenu()\" class=\"text-gray-700\">\r\n <svg class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 6h16M4 12h16M4 18h16\" \/>\r\n <\/svg>\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <div id=\"mobile-menu\" class=\"md:hidden hidden bg-white border-t\">\r\n <div class=\"px-4 pt-2 pb-3 space-y-1\">\r\n <a href=\"#inicio\" class=\"block px-3 py-2 text-gray-700 hover:text-eco-purple\">Inicio<\/a>\r\n <a href=\"#servicios\" class=\"block px-3 py-2 text-gray-700 hover:text-eco-purple\">Servicios<\/a>\r\n <a href=\"#nosotros\" class=\"block px-3 py-2 text-gray-700 hover:text-eco-purple\">Nosotros<\/a>\r\n <a href=\"#contacto\" class=\"block px-3 py-2 text-gray-700 hover:text-eco-purple\">Contacto<\/a>\r\n <a href=\"#agendamiento\" class=\"block px-3 py-2 bg-eco-purple text-white rounded-lg mt-2\">Agendar Cita<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/header>\r\n\r\n \r\n <section id=\"inicio\" class=\"relative min-h-screen flex items-center\">\r\n <div class=\"absolute inset-0 bg-gradient-to-r from-eco-purple to-blue-800\"><\/div>\r\n <div class=\"relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-32\">\r\n <div class=\"grid lg:grid-cols-2 gap-12 items-center\">\r\n <div class=\"text-white\">\r\n <h1 class=\"text-5xl lg:text-6xl font-bold font-montserrat mb-6\">\r\n Lavado Ecol\u00f3gico\r\n <span class=\"text-eco-yellow\">Profesional<\/span>\r\n <\/h1>\r\n <p class=\"text-xl mb-8 text-gray-200 leading-relaxed\">\r\n Tecnolog\u00eda avanzada y productos biodegradables para el cuidado integral de su veh\u00edculo. \r\n Comprometidos con la excelencia y el medio ambiente.\r\n <\/p>\r\n <div class=\"flex flex-col sm:flex-row gap-4\">\r\n <a href=\"#agendamiento\" class=\"bg-eco-orange hover:bg-orange-600 text-white px-8 py-4 rounded-lg font-semibold text-lg transition-colors text-center\">\r\n Solicitar Servicio\r\n <\/a>\r\n <a href=\"#servicios\" class=\"border-2 border-white text-white hover:bg-white hover:text-eco-purple px-8 py-4 rounded-lg font-semibold text-lg transition-colors text-center\">\r\n Ver Servicios\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n \r\n \r\n <div class=\"grid grid-cols-2 gap-6\">\r\n <div class=\"bg-white\/10 backdrop-blur-sm rounded-xl p-6 text-center text-white\">\r\n <div class=\"text-3xl font-bold text-eco-yellow mb-2\">95%<\/div>\r\n <div class=\"text-sm\">Menos consumo de agua<\/div>\r\n <\/div>\r\n <div class=\"bg-white\/10 backdrop-blur-sm rounded-xl p-6 text-center text-white\">\r\n <div class=\"text-3xl font-bold text-eco-yellow mb-2\">100%<\/div>\r\n <div class=\"text-sm\">Productos biodegradables<\/div>\r\n <\/div>\r\n <div class=\"bg-white\/10 backdrop-blur-sm rounded-xl p-6 text-center text-white\">\r\n <div class=\"text-3xl font-bold text-eco-yellow mb-2\">40min<\/div>\r\n <div class=\"text-sm\">Tiempo promedio<\/div>\r\n <\/div>\r\n <div class=\"bg-white\/10 backdrop-blur-sm rounded-xl p-6 text-center text-white\">\r\n <div class=\"text-3xl font-bold text-eco-yellow mb-2\">5\u2605<\/div>\r\n <div class=\"text-sm\">Calificaci\u00f3n promedio<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section id=\"servicios\" class=\"py-20 bg-eco-gray\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"text-center mb-16\">\r\n <h2 class=\"text-4xl font-bold text-eco-dark mb-4 font-montserrat\">\r\n Nuestros Servicios\r\n <\/h2>\r\n <p class=\"text-xl text-gray-600 max-w-3xl mx-auto\">\r\n Ofrecemos una gama completa de servicios de lavado ecol\u00f3gico dise\u00f1ados para satisfacer todas sus necesidades\r\n <\/p>\r\n <\/div>\r\n \r\n <div class=\"grid md:grid-cols-3 gap-8\">\r\n \r\n <div class=\"service-card bg-white rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all\">\r\n <div class=\"text-center mb-6\">\r\n <div class=\"w-16 h-16 bg-gray-100 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <span class=\"text-2xl\">\ud83e\udd48<\/span>\r\n <\/div>\r\n <h3 class=\"text-2xl font-bold text-gray-800 font-montserrat\">Silver<\/h3>\r\n <p class=\"text-gray-600 mt-2\">Servicio esencial<\/p>\r\n <\/div>\r\n <ul class=\"space-y-3 mb-8\">\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Lavado exterior completo\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Aspirado interior del veh\u00edculo\r\n <\/li>\r\n <\/ul>\r\n <button class=\"w-full bg-gray-600 hover:bg-gray-700 text-white py-3 rounded-lg font-semibold transition-colors\">\r\n Seleccionar Silver\r\n <\/button>\r\n <\/div>\r\n \r\n \r\n <div class=\"service-card bg-white rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all border-2 border-eco-yellow\">\r\n <div class=\"text-center mb-6\">\r\n <div class=\"w-16 h-16 bg-yellow-100 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <span class=\"text-2xl\">\ud83e\udd47<\/span>\r\n <\/div>\r\n <h3 class=\"text-2xl font-bold text-eco-yellow font-montserrat\">Gold<\/h3>\r\n <p class=\"text-gray-600 mt-2\">M\u00e1s popular<\/p>\r\n <div class=\"bg-eco-yellow text-white text-xs px-3 py-1 rounded-full inline-block mt-2\">\r\n RECOMENDADO\r\n <\/div>\r\n <\/div>\r\n <ul class=\"space-y-3 mb-8\">\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Todo lo incluido en Silver\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Hidrataci\u00f3n partes oscuras\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Pulido con m\u00e1quina\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Descontaminaci\u00f3n de ductos\r\n <\/li>\r\n <\/ul>\r\n <button class=\"w-full bg-eco-yellow hover:bg-yellow-500 text-white py-3 rounded-lg font-semibold transition-colors\">\r\n Seleccionar Gold\r\n <\/button>\r\n <\/div>\r\n \r\n \r\n <div class=\"service-card bg-white rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all\">\r\n <div class=\"text-center mb-6\">\r\n <div class=\"w-16 h-16 bg-purple-100 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <span class=\"text-2xl\">\ud83d\udc8e<\/span>\r\n <\/div>\r\n <h3 class=\"text-2xl font-bold text-eco-purple font-montserrat\">Diamond<\/h3>\r\n <p class=\"text-gray-600 mt-2\">Servicio premium<\/p>\r\n <\/div>\r\n <ul class=\"space-y-3 mb-8\">\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Todo lo incluido en Gold\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Lavado completo de motor\r\n <\/li>\r\n <li class=\"flex items-center\">\r\n <svg class=\"w-5 h-5 text-eco-green mr-3\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"><\/path>\r\n <\/svg>\r\n Lavado completo de cojiner\u00eda\r\n <\/li>\r\n <\/ul>\r\n <button class=\"w-full bg-eco-purple hover:bg-purple-700 text-white py-3 rounded-lg font-semibold transition-colors\">\r\n Seleccionar Diamond\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section id=\"nosotros\" class=\"py-20 bg-white\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"grid lg:grid-cols-2 gap-16 items-center\">\r\n <div>\r\n <h2 class=\"text-4xl font-bold text-eco-dark mb-6 font-montserrat\">\r\n Compromiso con la Excelencia y el Medio Ambiente\r\n <\/h2>\r\n <p class=\"text-lg text-gray-600 mb-8 leading-relaxed\">\r\n En EcoSpa combinamos tecnolog\u00eda de vanguardia con productos 100% biodegradables para ofrecer \r\n un servicio de lavado que cuida tanto su veh\u00edculo como nuestro planeta.\r\n <\/p>\r\n \r\n <div class=\"space-y-6\">\r\n <div class=\"flex items-start\">\r\n <div class=\"w-12 h-12 bg-eco-green\/10 rounded-lg flex items-center justify-center mr-4 flex-shrink-0\">\r\n <svg class=\"w-6 h-6 text-eco-green\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Tecnolog\u00eda Avanzada<\/h3>\r\n <p class=\"text-gray-600\">Equipos de \u00faltima generaci\u00f3n que reducen el consumo de agua en un 95%<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"flex items-start\">\r\n <div class=\"w-12 h-12 bg-eco-purple\/10 rounded-lg flex items-center justify-center mr-4 flex-shrink-0\">\r\n <svg class=\"w-6 h-6 text-eco-purple\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Productos Ecol\u00f3gicos<\/h3>\r\n <p class=\"text-gray-600\">F\u00f3rmulas biodegradables que protegen el medio ambiente<\/p>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"flex items-start\">\r\n <div class=\"w-12 h-12 bg-eco-orange\/10 rounded-lg flex items-center justify-center mr-4 flex-shrink-0\">\r\n <svg class=\"w-6 h-6 text-eco-orange\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 10V3L4 14h7v7l9-11h-7z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Servicio R\u00e1pido<\/h3>\r\n <p class=\"text-gray-600\">Procesos optimizados para completar el servicio en tiempo r\u00e9cord<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"bg-eco-gray rounded-2xl p-8\">\r\n <div class=\"grid grid-cols-2 gap-6\">\r\n <div class=\"text-center\">\r\n <div class=\"text-4xl font-bold text-eco-purple mb-2 font-montserrat\">1000+<\/div>\r\n <div class=\"text-gray-600\">Veh\u00edculos atendidos<\/div>\r\n <\/div>\r\n <div class=\"text-center\">\r\n <div class=\"text-4xl font-bold text-eco-green mb-2 font-montserrat\">50K<\/div>\r\n <div class=\"text-gray-600\">Litros de agua ahorrados<\/div>\r\n <\/div>\r\n <div class=\"text-center\">\r\n <div class=\"text-4xl font-bold text-eco-orange mb-2 font-montserrat\">98%<\/div>\r\n <div class=\"text-gray-600\">Clientes satisfechos<\/div>\r\n <\/div>\r\n <div class=\"text-center\">\r\n <div class=\"text-4xl font-bold text-eco-yellow mb-2 font-montserrat\">24\/7<\/div>\r\n <div class=\"text-gray-600\">Soporte disponible<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section id=\"agendamiento\" class=\"py-20 bg-eco-gray\">\r\n <div class=\"max-w-4xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"text-center mb-12\">\r\n <h2 class=\"text-4xl font-bold text-eco-dark mb-4 font-montserrat\">\r\n Agendar Servicio\r\n <\/h2>\r\n <p class=\"text-xl text-gray-600\">Complete el formulario y nos pondremos en contacto con usted<\/p>\r\n <\/div>\r\n \r\n <div class=\"bg-white rounded-2xl shadow-xl p-8\">\r\n <form id=\"bookingForm\" class=\"space-y-6\">\r\n <div class=\"grid md:grid-cols-2 gap-6\">\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Nombre Completo *<\/label>\r\n <input type=\"text\" required class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <\/div>\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Tel\u00e9fono *<\/label>\r\n <input type=\"tel\" required class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"grid md:grid-cols-2 gap-6\">\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Email<\/label>\r\n <input type=\"email\" class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <\/div>\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Tipo de Veh\u00edculo<\/label>\r\n <select class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <option value=\"\">Seleccionar<\/option>\r\n <option value=\"automovil\">Autom\u00f3vil<\/option>\r\n <option value=\"camioneta\">Camioneta<\/option>\r\n <option value=\"suv\">SUV<\/option>\r\n <option value=\"otro\">Otro<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"grid md:grid-cols-2 gap-6\">\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Fecha Preferida<\/label>\r\n <input type=\"date\" class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <\/div>\r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Hora Preferida<\/label>\r\n <select class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\">\r\n <option value=\"\">Seleccionar hora<\/option>\r\n <option value=\"08:00\">08:00 AM<\/option>\r\n <option value=\"09:00\">09:00 AM<\/option>\r\n <option value=\"10:00\">10:00 AM<\/option>\r\n <option value=\"11:00\">11:00 AM<\/option>\r\n <option value=\"14:00\">02:00 PM<\/option>\r\n <option value=\"15:00\">03:00 PM<\/option>\r\n <option value=\"16:00\">04:00 PM<\/option>\r\n <option value=\"17:00\">05:00 PM<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n \r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-3\">Tipo de Servicio *<\/label>\r\n <div class=\"grid md:grid-cols-3 gap-4\">\r\n <label class=\"flex items-center p-4 border-2 border-gray-200 rounded-lg cursor-pointer hover:border-eco-purple transition-colors\">\r\n <input type=\"radio\" name=\"service\" value=\"silver\" required class=\"text-eco-purple\">\r\n <div class=\"ml-3\">\r\n <div class=\"font-semibold text-gray-700\">\ud83e\udd48 Silver<\/div>\r\n <div class=\"text-sm text-gray-500\">Servicio b\u00e1sico<\/div>\r\n <\/div>\r\n <\/label>\r\n <label class=\"flex items-center p-4 border-2 border-gray-200 rounded-lg cursor-pointer hover:border-eco-purple transition-colors\">\r\n <input type=\"radio\" name=\"service\" value=\"gold\" required class=\"text-eco-purple\">\r\n <div class=\"ml-3\">\r\n <div class=\"font-semibold text-eco-yellow\">\ud83e\udd47 Gold<\/div>\r\n <div class=\"text-sm text-gray-500\">M\u00e1s popular<\/div>\r\n <\/div>\r\n <\/label>\r\n <label class=\"flex items-center p-4 border-2 border-gray-200 rounded-lg cursor-pointer hover:border-eco-purple transition-colors\">\r\n <input type=\"radio\" name=\"service\" value=\"diamond\" required class=\"text-eco-purple\">\r\n <div class=\"ml-3\">\r\n <div class=\"font-semibold text-eco-purple\">\ud83d\udc8e Diamond<\/div>\r\n <div class=\"text-sm text-gray-500\">Premium<\/div>\r\n <\/div>\r\n <\/label>\r\n <\/div>\r\n <\/div>\r\n \r\n <div>\r\n <label class=\"block text-sm font-semibold text-gray-700 mb-2\">Comentarios adicionales<\/label>\r\n <textarea rows=\"4\" class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-eco-purple focus:border-transparent transition-colors\" placeholder=\"Informaci\u00f3n adicional sobre su veh\u00edculo o preferencias...\"><\/textarea>\r\n <\/div>\r\n \r\n <button type=\"submit\" class=\"w-full bg-eco-purple hover:bg-purple-700 text-white font-semibold py-4 px-6 rounded-lg text-lg transition-colors\">\r\n Enviar Solicitud\r\n <\/button>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section id=\"contacto\" class=\"py-20 bg-white\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"text-center mb-16\">\r\n <h2 class=\"text-4xl font-bold text-eco-dark mb-4 font-montserrat\">\r\n Contacto\r\n <\/h2>\r\n <p class=\"text-xl text-gray-600\">Estamos aqu\u00ed para atenderle<\/p>\r\n <\/div>\r\n \r\n <div class=\"grid lg:grid-cols-3 gap-8\">\r\n <div class=\"text-center\">\r\n <div class=\"w-16 h-16 bg-eco-purple\/10 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <svg class=\"w-8 h-8 text-eco-purple\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Tel\u00e9fono<\/h3>\r\n <p class=\"text-gray-600\">+57 300 123 4567<\/p>\r\n <p class=\"text-sm text-gray-500\">Lun - S\u00e1b: 8:00 AM - 6:00 PM<\/p>\r\n <\/div>\r\n \r\n <div class=\"text-center\">\r\n <div class=\"w-16 h-16 bg-eco-green\/10 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <svg class=\"w-8 h-8 text-eco-green\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Email<\/h3>\r\n <p class=\"text-gray-600\">info@ecospa.com<\/p>\r\n <p class=\"text-sm text-gray-500\">Respuesta en 24 horas<\/p>\r\n <\/div>\r\n \r\n <div class=\"text-center\">\r\n <div class=\"w-16 h-16 bg-eco-orange\/10 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <svg class=\"w-8 h-8 text-eco-orange\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z\"><\/path>\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 11a3 3 0 11-6 0 3 3 0 016 0z\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <h3 class=\"text-xl font-semibold text-eco-dark mb-2 font-montserrat\">Ubicaci\u00f3n<\/h3>\r\n <p class=\"text-gray-600\">Calle Verde 123<\/p>\r\n <p class=\"text-sm text-gray-500\">Servicio a domicilio disponible<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <footer class=\"bg-eco-dark text-white py-12\">\r\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n <div class=\"grid md:grid-cols-4 gap-8\">\r\n <div>\r\n <div class=\"text-2xl font-bold mb-4 font-montserrat\">EcoSpa<\/div>\r\n <p class=\"text-gray-400 mb-4\">Lavado ecol\u00f3gico profesional comprometido con la excelencia y el cuidado del medio ambiente.<\/p>\r\n <\/div>\r\n <div>\r\n <h3 class=\"font-semibold mb-4 font-montserrat\">Servicios<\/h3>\r\n <ul class=\"space-y-2 text-gray-400\">\r\n <li>Lavado Silver<\/li>\r\n <li>Lavado Gold<\/li>\r\n <li>Lavado Diamond<\/li>\r\n <li>Servicios Corporativos<\/li>\r\n <\/ul>\r\n <\/div>\r\n <div>\r\n <h3 class=\"font-semibold mb-4 font-montserrat\">Empresa<\/h3>\r\n <ul class=\"space-y-2 text-gray-400\">\r\n <li>Nosotros<\/li>\r\n <li>Compromiso Ambiental<\/li>\r\n <li>Testimonios<\/li>\r\n <li>Contacto<\/li>\r\n <\/ul>\r\n <\/div>\r\n <div>\r\n <h3 class=\"font-semibold mb-4 font-montserrat\">Contacto<\/h3>\r\n <div class=\"space-y-2 text-gray-400\">\r\n <div>+57 300 123 4567<\/div>\r\n <div>info@ecospa.com<\/div>\r\n <div>Calle Verde 123<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"border-t border-gray-700 mt-8 pt-8 text-center text-gray-400\">\r\n <p>© 2024 EcoSpa. Todos los derechos reservados.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/footer>\r\n\r\n \r\n <div id=\"successModal\" class=\"fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center z-50\">\r\n <div class=\"bg-white rounded-2xl p-8 max-w-md mx-4 text-center\">\r\n <div class=\"w-16 h-16 bg-eco-green\/10 rounded-full flex items-center justify-center mx-auto mb-4\">\r\n <svg class=\"w-8 h-8 text-eco-green\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <h3 class=\"text-2xl font-bold text-eco-dark mb-4 font-montserrat\">\u00a1Solicitud Enviada!<\/h3>\r\n <p class=\"text-gray-600 mb-6\">Hemos recibido su solicitud. Nos pondremos en contacto con usted dentro de las pr\u00f3ximas 2 horas para confirmar su cita.<\/p>\r\n <button onclick=\"closeModal()\" class=\"bg-eco-purple hover:bg-purple-700 text-white font-semibold py-3 px-6 rounded-lg transition-colors\">\r\n Entendido\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Mobile menu toggle\r\n function toggleMenu() {\r\n const menu = document.getElementById('mobile-menu');\r\n menu.classList.toggle('hidden');\r\n }\r\n\r\n \/\/ Smooth scrolling\r\n document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\r\n anchor.addEventListener('click', function (e) {\r\n e.preventDefault();\r\n const target = document.querySelector(this.getAttribute('href'));\r\n if (target) {\r\n target.scrollIntoView({\r\n behavior: 'smooth',\r\n block: 'start'\r\n });\r\n }\r\n document.getElementById('mobile-menu').classList.add('hidden');\r\n });\r\n });\r\n\r\n \/\/ Form submission\r\n document.getElementById('bookingForm').addEventListener('submit', function(e) {\r\n e.preventDefault();\r\n document.getElementById('successModal').classList.remove('hidden');\r\n document.getElementById('successModal').classList.add('flex');\r\n this.reset();\r\n });\r\n\r\n \/\/ Close modal\r\n function closeModal() {\r\n document.getElementById('successModal').classList.add('hidden');\r\n document.getElementById('successModal').classList.remove('flex');\r\n }\r\n\r\n \/\/ Set minimum date to today\r\n const dateInput = document.querySelector('input[type=\"date\"]');\r\n if (dateInput) {\r\n const today = new Date().toISOString().split('T')[0];\r\n dateInput.setAttribute('min', today);\r\n }\r\n\r\n \/\/ Service selection from service cards\r\n document.querySelectorAll('.service-card button').forEach(button => {\r\n button.addEventListener('click', function() {\r\n const service = this.textContent.toLowerCase().includes('silver') ? 'silver' :\r\n this.textContent.toLowerCase().includes('gold') ? 'gold' : 'diamond';\r\n \r\n \/\/ Scroll to booking section\r\n document.getElementById('agendamiento').scrollIntoView({\r\n behavior: 'smooth',\r\n block: 'start'\r\n });\r\n \r\n \/\/ Pre-select the service\r\n setTimeout(() => {\r\n const radioButton = document.querySelector(`input[value=\"${service}\"]`);\r\n if (radioButton) {\r\n radioButton.checked = true;\r\n radioButton.closest('label').classList.add('border-eco-purple');\r\n }\r\n }, 500);\r\n });\r\n });\r\n\r\n \/\/ Add scroll effect to navigation\r\n window.addEventListener('scroll', function() {\r\n const header = document.querySelector('header');\r\n if (window.scrollY > 100) {\r\n header.classList.add('bg-white\/95', 'backdrop-blur-sm');\r\n } else {\r\n header.classList.remove('bg-white\/95', 'backdrop-blur-sm');\r\n }\r\n });\r\n <\/script>\r\n<script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML=\"window.__CF$cv$params={r:'95f59a5261b9af83',t:'MTc1MjU0NDE2MS4wMDAwMDA='};var a=document.createElement('script');a.nonce='';a.src='\/cdn-cgi\/challenge-platform\/scripts\/jsd\/main.js';document.getElementsByTagName('head')[0].appendChild(a);\";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();<\/script><\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>EcoSpa – Lavado Ecol\u00f3gico Profesional EcoSpa Lavado Profesional Inicio Servicios Nosotros Contacto Agendar Cita Inicio Servicios Nosotros Contacto Agendar Cita Lavado Ecol\u00f3gico Profesional Tecnolog\u00eda avanzada y productos biodegradables para el cuidado integral de su veh\u00edculo. Comprometidos con la excelencia y el medio ambiente. Solicitar Servicio Ver Servicios 95% Menos consumo de agua 100% Productos biodegradables 40min Tiempo promedio 5\u2605 Calificaci\u00f3n promedio Nuestros Servicios Ofrecemos una gama completa de servicios de lavado ecol\u00f3gico dise\u00f1ados para satisfacer todas sus necesidades \ud83e\udd48 Silver Servicio esencial Lavado exterior completo Aspirado interior del veh\u00edculo Seleccionar Silver \ud83e\udd47 Gold M\u00e1s popular RECOMENDADO Todo lo incluido en Silver Hidrataci\u00f3n partes oscuras Pulido con m\u00e1quina Descontaminaci\u00f3n de ductos Seleccionar Gold \ud83d\udc8e Diamond Servicio premium Todo lo incluido en Gold Lavado completo de motor Lavado completo de cojiner\u00eda Seleccionar Diamond Compromiso con la Excelencia y el Medio Ambiente En EcoSpa combinamos tecnolog\u00eda de vanguardia con productos 100% biodegradables para ofrecer un servicio de lavado que cuida tanto su veh\u00edculo como nuestro planeta. Tecnolog\u00eda Avanzada Equipos de \u00faltima generaci\u00f3n que reducen el consumo de agua en un 95% Productos Ecol\u00f3gicos F\u00f3rmulas biodegradables que protegen el medio ambiente Servicio R\u00e1pido Procesos optimizados para completar el servicio en tiempo r\u00e9cord 1000+ Veh\u00edculos atendidos 50K Litros de agua ahorrados 98% Clientes satisfechos 24\/7 Soporte disponible Agendar Servicio Complete el formulario y nos pondremos en contacto con usted Nombre Completo * Tel\u00e9fono * Email Tipo de Veh\u00edculo SeleccionarAutom\u00f3vilCamionetaSUVOtro Fecha Preferida Hora Preferida Seleccionar hora08:00 AM09:00 AM10:00 AM11:00 AM02:00 PM03:00 PM04:00 PM05:00 PM Tipo de Servicio * \ud83e\udd48 Silver Servicio b\u00e1sico \ud83e\udd47 Gold M\u00e1s popular \ud83d\udc8e Diamond Premium Comentarios adicionales Enviar Solicitud Contacto Estamos aqu\u00ed para atenderle Tel\u00e9fono +57 300 123 4567 Lun – S\u00e1b: 8:00 AM – 6:00 PM Email info@ecospa.com Respuesta en 24 horas Ubicaci\u00f3n Calle Verde 123 Servicio a domicilio disponible EcoSpa Lavado ecol\u00f3gico profesional comprometido con la excelencia y el cuidado del medio ambiente. Servicios Lavado Silver Lavado Gold Lavado Diamond Servicios Corporativos Empresa Nosotros Compromiso Ambiental Testimonios Contacto Contacto +57 300 123 4567 info@ecospa.com Calle Verde 123 © 2024 EcoSpa. Todos los derechos reservados. \u00a1Solicitud Enviada! Hemos recibido su solicitud. Nos pondremos en contacto con usted dentro de las pr\u00f3ximas 2 horas para confirmar su cita. Entendido<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-2","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/pages\/2","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ecospa.eco\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2"}],"version-history":[{"count":4,"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/pages\/2\/revisions"}],"predecessor-version":[{"id":12,"href":"https:\/\/ecospa.eco\/index.php?rest_route=\/wp\/v2\/pages\/2\/revisions\/12"}],"wp:attachment":[{"href":"https:\/\/ecospa.eco\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}